Can I replace $ by $('form')? - jquery-validate

I use this https://jsfiddle.net/rz0zk5u6/2/ to validate 2 forms on the same page.
To differentiate the forms, can I replace
$.validator.setDefaults({});
by
$("#loginForm").validator.setDefaults({});
?

$.validator.setDefaults({});
is for setting the global defaults. If you wish to set per-form options, use:
var loginForm = $('#loginForm').validate({
// options go here
});
as described in the docs. Then you can use:
loginForm.form();
to perform the validation as described here.

Yes, jquery plugins will apply to elements in a selection/jquery object. If you select multiple forms, it will apply the validator to all of them. The following all do the same thing; Apply the validator to multiple forms.
$('form').validator.setDefaults({});
$('#loginForm, #anotherForm').validator.setDefaults({});
var forms = $('form');
forms.validator.setDefaults({});

Related

Kendo-Grid Angular UI trackby

In Angulars ngFor you can use trackBy to pass a key so that Angular doesn't reload everything but only the items really needed.
Does the kendo-grid also function that way and if not by default, is it possible to pass a key to it, too?
Yes, here is the documentation link: https://www.telerik.com/kendo-angular-ui/components/grid/api/GridComponent/#toc-trackby
A quick example would be something like this:
<!-- template -->
<kendo-grid
[kendoGridBinding]="taskData"
[trackBy]="trackById">
trackById(index: number, item: GridItem) {
const dataItem = item.data as TaskItem;
return dataItem.id;
}

Kendo Ui AutoComplete - How to change default filter "startWith" to "contains"?

My application built with AngularJs and KendoUI controls. I used AutoComplete Text Box so many places in the application. Now client wants that search should be with "Contains" filter. for the same i need to put filter: 'contains' everywhere AutoComplete control used.
I want to change default filter 'startWith' to 'contains' at beginning of the application. So that i can escape to make change every html file.
can anyone knows how to do the same?
I guess you need to update your auto complete filter property at least once for all controls to support dynamic property binding and bind to some root configuration, like:
<input kendo-auto-complete k-filter="config.autoComplete.defaultFilter" />
So will be able to change default filter in future by updating only config value.
Another approach - is to override default "setOptions" behavior for "AutoComplete" component to use correct filter by default somewhere on app start:
var nativeSetOptions = window.kendo.ui.AutoComplete.prototype.setOptions;
window.kendo.ui.AutoComplete.prototype.setOptions = function(options) {
options.filter = 'contains';
nativeSetOptions.call(this, options);
}
You can use k-options attribute:
<input kendo-auto-complete ng-model="yourModel" k-data-source="yourDataSource" style="width: 100%;" k-options="autocompleteOptions"/>
and then in your controller:
$scope.autocompleteOptions = {
filter:"contains"
}

Custom sap.ui.core.messagebundle texts

How can we use custom translations for sap.ui.core.messagebundle? We'd like to provide our own validation messages (e.g., for String.Search)?
var oBundle;
defaultLocale = "en-EN";
var countryLocale = "de-FR";
oBundle= jQuery.sap.resources({url : "i18n/labels-en.properties", locale: defaultLocale});
//If need to use any other language have a condition to define accordingly.
//oBundle= jQuery.sap.resources({url :"i18n/labels-fr.properties", locale: countryLocale });
And in your controls just below to setText
oBundle.getText("label.title");
The texts in the types are hard-coded and bound to the libraries bundle. Therefore you can not change them. The only approach to do that would be to inherit from a UI5 type and extend it to your needs.
Fortunately you can always use the Control events validationError and validationSuccess to handle the validation yourself and use your own texts there.

angular ui-grid filter on button click

I'm new in angular. We are using UI-grid for data presentation is is possible to customize filter process. I want to customize it in that way, that filtering is peformmed on button click, not on keydown?
This is idea
$scope.search = function (){
$scope.personCardGrid.useExternalFiltering = false; $scope.grid1Api.core.notifyDataChange(uiGridConstants.dataChange.ALL);
$scope.gridApi.core.refresh() $scope.personCardGrid.useExternalFiltering = true;
$scope.grid1Api.core.notifyDataChange(uiGridConstants.dataChange.ALL);
$scope.gridApi.core.refresh() }
Regards
You need to define your own headerCellTemplate for the column. In the template, add a input text box and a button too. Then, define a function in the controller and call it using the external scope which will filter the records.

implement chanied filters/seach options in a datagrid using ajax

Let´s say I have some sort of datagrid and I want to add a couple chained filters like in this site:
http://www.yelp.com/search?find_desc=bar&ns=1&find_loc=Minneapolis%2C+MN
(sort by,distance,price etc).
Each time a user clciked in a filter link it will update the content of datagrid accordingly. But I would also need to update the links in other filters to take account of the changes. Ex: if i change the order field I need to add/update ?order_field=x in all the other filters links.
What you think is the best way to implement such scenario?
Should i create a function that, when a filter link is clicked, it update the query string params of all the other filters? Or use hidden fields to record the selected option in each filter?
I would like a reusable solution if possible.
Since the data is loading via AJAX, there shouldn't be any links to update - at least not if you mean anchor tags <a>. You don't even need to store the filters in a hidden field.
I would store all the filters as a JSON object. Depending on how your API is set up, you may have to convert the JSON object to something usable by your API or you may even be able to pass on the JSON object directly in the $.ajax request.
This sample code assumes you have a textbox with id="price" in the markup. I intentionally left convert_filters_to_parameters blank because you didnt provide any details as to your API. jQuery will in turn serialize those parameters into a GET or POST request before it sends them out.
var filters = {
distance:null,
price:null,
sortBy:'distance'
}
//this assumes you have a textbox with id="price"
$('#price').changed(function()
{
filters.price = $(this).val();
refresh_data();
});
function refresh_data()
{
var parameters = convert_filters_to_parameters(filters);
$.ajax('/my_api',
{
//i left out a lot of properties here for brevity
data: parameters,
success: function(response) { alert(response); }
});
}

Resources