jquery验证插件和submitHandler

时间:2012-10-20 06:58:24

标签: jquery jquery-validate

我有form正在使用jQuery验证,并且还通过php对数据库进行ajax调用,以便在第一次选择之后显示信息,然后在提交之后显示。

这是我可以接受的工作。唯一剩下的问题是form允许用户在存在应该纠正的验证错误时提交。

我相信submitHandler是让它发挥作用的关键,但我在评论//tried various things here时尝试的任何代码都会导致各种不同的问题。

以下是该页面的代码:

<html>
<head>
<script src="../../jquery_theme/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="dist/jquery.validate.js"></script>

<script>
$(document).ready(function(){
$("#commentForm").validate({
    submitHandler: function(form) {
        //tried various things here
        }
    });
 });

</script>

</head>
<body>


<form class="cmxform" id="commentForm"  >
<fieldset>

 <p> <label for="select_part">Select Part to Adjust Count</label></p>  

          <div>  <select name="id_part" id="select_part" class="required" >
                <option value="">---</option>
                <option value="1">option1</option>
                <option value="2">option2</option>

            </select>

                <div id="returnedValue" class="ajaxReturn"></div>
            </div>
                <br />

 <p>
 <label for="cname">Name</label>
 <em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" />
 </p>
 <input id="submitForm" class="submit" type="submit" value="Submit"/>
 </p>
 </fieldset>
 </form>
 <p><div id="returns"></div></p>
 <script type="text/javascript" src="validateTestDB.js"></script>
 </body>
 </html>

以下是将信息反馈给页面的JavaScript:

$('#select_part').change(function(){
var select_part = $('#select_part').val();


$.post('../../php/getCounts.php', { select_part: select_part}, function(data){
$('#returnedValue').hide().html(data).fadeIn(1200);


      });
   });

 $('#submitForm').click(function(){


var select_part = $('#select_part').val();
var name = $('#cname').val();
$.post('validateResult.php', {select_part: select_part, name: name}, function (data3){
    $('#returns').html(data3);
     });

}); 

我已经阅读并尝试了两天,我只是被卡住了。

1 个答案:

答案 0 :(得分:5)

您有一个点击处理程序$('#submitForm').click(),它干扰了验证码中的submitHandler:。这是多余的,应删除.click()处理程序以支持submitHandler:。然后,所需的代码应放在里面 submitHandler,就像这样...

$(document).ready(function(){
    $("#commentForm").validate({
        submitHandler: function(form) {
            var select_part = $('#select_part').val();
            var name = $('#cname').val();
            $.post('validateResult.php', {select_part: select_part, name: name}, function (data3){
                $('#returns').html(data3);
            });
        }
    });
});