jquery验证插件和submitHandler [英] jquery validation plugin and submitHandler

查看:75
本文介绍了jquery验证插件和submitHandler的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I have a form that is using jQuery validation and is also making ajax calls to a database via php to display information after the first select, and then after submit.

这就像我可以使它工作一样接近。唯一剩下的问题是表单将允许用户在存在应该更正的验证错误时提交。

This is as close as I can get it to working. The only remaining problem is that the form will allow the user to submit it when there are validation errors that should be corrected.

我相信 submitHandler 是让它工作的关键,但是我试过的任何代码 //尝试了各种各样的事情导致了各种不同的问题。

I believe the submitHandler is the key to making it work, but any code I have tried where I comment //tried various things here has caused various different problems.

以下是该页面的代码:

<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:

Here is the javascript that feeds info back to the page:

$('#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);
     });

}); 

我一直在阅读和尝试两天,我只是被卡住了。

I've been reading and trying things for two days, and I'm just stuck.

推荐答案

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

You have a click handler, $('#submitForm').click(), that is interfering with the submitHandler: inside the validation code. This is redundant and the .click() handler should be removed in favor of the submitHandler:. The desired code should then be placed inside the submitHandler, something like this...

$(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);
            });
        }
    });
});

这篇关于jquery验证插件和submitHandler的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆