validating the form is not working
my form validation does not firing...if i try to submit this form without entering anything then it should validate but in this case it does accept the form.
<script src="Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
$("#register").click(function (event) {
// validate the comment form when it is submitted
// validate signup form on keyup and submit
$("#form1").validate({
rules: {
firstname: "required",
lastname:开发者_运维技巧 "required",
//city: "required",
state: "required",
country: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
//city: "Please enter a valid email address",
country: "Please select your country"
}
});
$("#form1").validate({
submitHandler: PostData
});
function PostData() {
$.ajax(url, { Id: '1' },
function (data, textStatus) {
//alert(textStatus);
});
}
});
});
</script>
<div id="content-main">
<div class="main-inner">
<form id="form1" class="toolTip hasCorners" name="form1" action="http://site.com/"
onsubmit="return false;" method="post">
<fieldset>
<div class="fontWeight7">
<input type="radio" value="1" name="pledge_level" class="required">
<p class="radioText">
Iam on vacation.</p>
<label for="level1" class="error">
Please select</label>
</div>
<p class="required-msg">
All fields below are required</p>
<div class="subColumns paragraph">
<div class="lefty">
<div class="fontWeight7">
<label for="first_name">
First Name:</label>
<input id="first_name" class="text hasCorners required" name="first_name" type="text"
maxlength="200" value="">
<label for="level1" class="error">
Please enter your name!</label>
</div>
</div>
<div class="cdc-left">
<div class="fontWeight7">
<label for="last_initial">
Last Initial:</label>
<input id="last_initial" class="text hasCorners required" name="last_initial" type="text"
maxlength="200" value="">
<label for="level2" class="error">
Please enter your last initial!</label>
</div>
<rest of the code here .... >
</div>
</div>
<input id="register" name="register" value="Submit Your form"
type="submit">
The .validate
should be done once the document is ready, not on the click of the button. So take it out from there.
e.g.
$(document).ready(function () {
$("#form1").validate({
rules: {
firstname: "required",
lastname: "required",
//city: "required",
state: "required",
country: "required"
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
//city: "Please enter a valid email address",
country: "Please select your country"
},
submitHandler: PostData
});
});
});
function PostData() {
$.ajax(url,
{ Id: '1' },
function (data, textStatus) {
//alert(textStatus);
});
}
HTHs,
Charles
精彩评论