http://stackoverflow.com/questions/4687492/ajax-validation-using-jquery
http://docs.jquery.com/Plugins/Validation/Methods/remote#options
Now I'm gonna read up on those..
----
Well after tinkering around a bunch with jQuery validation plugin, I managed success doing AJAX validation per field, vs. over the whole form. There's lots of buggy example code out there, they suck. This one works - albeit ugly:
$(function() {
var response;
var retrigger = 0;
$.validator.addMethod("uniqueUserName", function(value, element) {
if(retrigger == 1)
return true;
$.ajax({
type: "POST",
url: "/TestHandler.ajax.axd",
data: "ajaxPost="+element.ID + "&value="+value,
dataType:"html",
success: function(msg)
{
response = (msg == 'True') ? true : false;
retrigger = 1;
$("#contact-form").validate().element("#Middle");
retrigger = 0;
}
})
return true;
}, "Username is Already Taken");
$.validator.addMethod("uniqueUserName2", function(value, element) {
return response;
}, "Username is ALready Taken2");
var test2 = $("#Middle");
//var test2 = $("#contact-form#Email");
test2.rules("add", {
uniqueUserName: true,
uniqueUserName2: true
});
});
So the basic concept is to allow jQuery validator plugin to manage all the focus/keyup etc. events and call us when we're really interested in validating something. Most code examples out there do the "uniqueUserName" but not the "uniqueUserName2". Long story short, AJAX is a 2-step process - the callback comes much later, so "uniqueUserName2" is our placeholder for that.
Flow goes as follows:
- You type something
- uniqueUserName validator runs and kicks off AJAX request. It always succeeds in validation, so it's kind of a dummy just to kick off the request
- at some point, the AJAX success function runs. We set our retrigger to 1 and brute force validation again on the same field.
- uniqueUserName validation runs again but this time we abort out before making the AJAX call - still returning success. Without this retrigger check, you'll keep sending AJAX requests forever.
- finally, uniqueUserName2 is evaluated and it is patiently waiting around with the results of our last AJAX response.
There are some good jQuery validation frameworks out there, this one in particular actually appears to be the least 'developed' featurewise, but its extensibility is hard to beat. Some other good ones I found are:
and
Validation Engine looks really powerful, but I felt constrained by how to present the errors - although his error reporting is perfectly adequate.
Valid8 also looks powerful, but I wasn't confident it was being maintained
Worth mentioning are both of these actually tout AJAX support, where jQuery validation plugin does not. But as you can see it's a little clunky but not too difficult to get it working.
Oh Javascript. It's like writing untyped C code all over again.... and not in a good way.
