Hi,
I have a jQuery Dialog form and
on submit I'm trying to validate the fields.
I'm using http://docs.jquery.com/Plugins/Validation to validate.
In this I'm facing an issue, the validate function is not being called.
I'm posting some snippet of my code
$("#register-dialog-form").dialog({
autoOpen: false,
height: 350,
width: 450,
modal: true,
buttons: {
'Register': function() {
$("#registerFrm").validate({
rules: {
accountid: "required",
name: {
required: true,
minlength: 5
},
username: {
required: true,
minlength: 5
},
password: {
required: true,
minlength: 5
}
},
messages: {
firstname: "Please enter your firstname",
accountid: "Please enter the lastname",
name: "Please enter a user friendly name",
username: {
required: "Please enter a username",
minlength: jQuery.format("Enter at least {0} characters")
},
password: {
required: "Please provide a password",
minlength: jQuery.format("Password must be at least {0} characters long")
}
}
});
//******************
//TODO: Need to submit my form here
//******************
$(this).dialog('
close');
},
Cancel: function() {
$(this).dialog('
close');
}
},
close: function() {
//$('registerFrm').clearForm();
}
});
Can someone please tell me what I'm doing wrong here.
I've also tried to put the validation into $(document).ready(function() {}, but with no success.
Here is the html code
<div id="register-dialog-form" title="Register Account - Master" align="center" style="display: none">
<s:form name="registerFrm" id="registerFrm" action="registermaster" method="POST">
<table width="90%" border="0" class="ui-widget">
<tr>
<td>
<s:textfield label="Account Id" name="accountid" id="accountid" cssClass="text ui-widget-content ui-corner-all" />
</td>
</tr>
<tr>
<td>
<s:textfield label="Name" name="name" id="name" cssClass="text ui-widget-content ui-corner-all" />
</td>
</tr>
<tr>
<td>
<s:textfield label="Username" name="username" id="username" cssClass="text ui-widget-content ui-corner-all" />
</td>
</tr>
<tr>
<td>
<s:password label="Password" name="password" id="password" cssClass="text ui-widget-content ui-corner-all" />
</td>
</tr>
</table>
</s:form>
</div><!--End of RegisterAcc form-->
