Hi,
I need help to add custom validation to the account textbox inside dialog editor to see if the account exist in the database through API. I tried below code but i can't seem to get it to work.
{ columnKey: "customerAcctNo", editorType: 'text', required: true, editorOptions: { validatorOptions: { custom: { method: function (value, fieldOps) { me._sharedService.validateAccount(value) .subscribe(data => { if (data) {return true;} else {return false;}}) }, errorMessage: "Account doesn't exist" } }, width: "100%" } },
SERVICE:
public validateAccount(account: string): Observable<IUser[]> { let params: URLSearchParams = new URLSearchParams(); if (account) { params.set('customerAcctNo', account); }
let requestOptions = new RequestOptions(); requestOptions.withCredentials = true; requestOptions.search = params;
return this._http.get(this._accountUrl, requestOptions) .map((response: Response) => { if (response) { return true; } else { return false } }) .do(data => console.log('account: ' + JSON.stringify(data))) .catch(this.handleError); }
thanks, it's exactly what i am looking for.
Hello evan,
You can call your service for example on valueChanged event of the editor, and in the callback ( inside the subscribe method) you can set a global value for the validation result depending on the result from the service.
valueChanged: function(e, ui) {
me._homeService.validateUser(ui.newValue)
.subscribe(data => {
if (data) {
me.validationRes = true;
} else {
me.validationRes = false;
}
jQuery("#customValidator").igValidator("validate");
}, error => {
});
That value can then be used in the custom validation method:
method: function (value, fieldOps) {
…
return me.validationRes;
I’ve attached a sample for your reference.
Let me know if you have any questions.
Best Regards,
Maya Kirova
Infragistics, Inc.
http://es.infragistics.com/support
I am not sure where to put the second part of the code. Can you show me a simple sample?
I also attached my sample code below.
Your validate account method is asynchronous while the custom.method function is not.This would not work since the response from the server will be executed after the custom.method has already been executed and resolved.
I suggest that you add a separate validator on the page, add the field from the dialog you want to additionally validate, for example:
features:[
{
name: "Updating",
editMode: "dialog",
rowEditDialogAfterOpen: function(e, ui){
jQuery("#customValidator").igValidator("addField",{ selector: jQuery("input[data-editor-for-{columnKey}]")});
]
Where {columnKey} is the key of the column which this editor should edit.
And in the callback from your remote service call you can force validation manually and check the result from the remote request inside the custom function, for example:
this.validationResult = false;
this.validatorOpts = {
fields:[],
errorMessage : "Custom error",
custom: function (evt, ui) {
return self. validationResult;
Let me know if that solves your issue.