PDA

View Full Version : Ajax in vtype function



fsa3
11 Jun 2009, 8:05 AM
I had a feeling this wasn't going to work but tried it anyway.

I want to create a vtype that uses Ajax to determine if validation succeeds. I have the following code:


Ext.apply(Ext.form.VTypes, {
nicknameUnique: function (val, field){
Ext.Ajax.request({
url : '/MFSAjaxServlet' ,
params : { ACTION : 'NICKCHECK', nickname: val },
method: 'GET',
success: function ( result, request) {
/*if(result.responseText=='AVAILABLE')
{
return true;
}
else
{
return false;
}*/
return true;
},
failure: function ( result, request) {
Ext.MessageBox.alert('Failed', 'Successfully posted form: '+result.date);
return false;
}
});

},
nicknameUniqueText: "Nickname already taken."
});

What's happening is that it always returns false. I'm guessing since ajax is asynchronous the function ends before the callback. I have some 'ugly' ideas on how to get what I want but wanted to get some other opinions on the cleanest/proper way to do it.

Thanks.

fsa3
11 Jun 2009, 4:35 PM
In case anyone finds this thread, the solution I came up with was to return true from the vtype function and in the callback using markInvalid on the field.

Code:


Ext.apply(Ext.form.VTypes, {
nicknameUnique: function (val, field){
Ext.Ajax.request({
url : '/MFSAjaxServlet' ,
params : { ACTION : 'NICKCHECK', nickname: val },
method: 'GET',
success: function ( result, request) {
if(result.responseText=='AVAILABLE')
{

}
else
{
field.markInvalid("Nickname already taken.");
}

},
failure: function ( result, request) {
field.markInvalid("Error validating nickname.");
}
});
return true;
},

nicknameUniqueText: "Nickname already taken."
});