Wednesday, July 1, 2009

[jQuery] Validate first and the carry on

I am using some jquery code to validate a form and then post the
results of the form via an ajax request to a script. I am struggling
with the code as when I click submit the form validates but then also
makes the ajax request. What I would like to be able to do is validate
the form and then if the form checks out ok then I would like the
other code to run.

I am using the plug in

http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js

I am new to jquery, I understand the validation how how to validate a
form using the plug in, and I am comfortable with the ajax request and
how to show and hide layers. I am in the tricky place where I cant get
the two to work together!

<script language="javascript">
$(document).ready(function()
{

$("#login_form").validate({
rules: {
namea: "required",

town: "required",

emaila: {
required: true,
email: true
}

}

});


$("#login_form").submit(function()
{
$.post("login.php",{ name:$('#namea').val(),password:$
('#password').val(),rand:Math.random() } ,function(data)
{
if(data=='OK')
{
$('#loginbox').hide();
$('#ajax_failed').hide();
$('#ajax_show').show();
$('#RegisterForm').show();

}
else
{
$('#name').val("");
$('#ajax_failed').show();
}

});
return false;
});
$("#password").blur(function()
{
$("#login_form").trigger('submit');
});
});
</script>

If anyone could point me in the right direction or show me how to
achieve this I would be most grateful.

JW

No comments: