validate表单验证-单独验证

    今天编写一个表单验证程序,我来讲一下今天遇到的坑:程序不是经过submit按钮提交验证的,是在本身写的一个方法中提交的,出现了表单没法验证的状况。而后我就了解了一下jquery validate的验证方法。html

    jquery validate表单验证方式有三个:jquery

    一、直接经过submit方式提交,提交时自动验证(经常使用的方法,不懂得能够查看 菜鸟教程-validate使用ajax

    二、若是不是submit提交,好比在jquery中的某个事件中,调用提交表单事件的状况,在此时,1中的状况就不适用了(可能出现表单不验证的方法),这也是我遇到的问题json

      这就须要本身先编写一个表单验证程序,验证经过后,再提交表单。函数

     //编写的表单验证程序 
     function
validateForm() { return $("#cashForm").validate({ rules: { name: { required: true }, phone: { required: true, pattern: /^0?(13[0-9]|15[012356789]|18[012346789]|14[57]|17[678]|170[059]|14[57]|166|19[89])[0-9]{8}$/ }, carId: { required: true, pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/ }, number: { required: true, remote: { url: "${base}/business/cash/check_card", cache: false } } }, messages: { phone: { pattern: "${message("common.validate.pattern")}" }, number: { remote: "${message("common.validate.pattern")}" } } }).form(); }

    提交表单事件:(如下函数是验证码验证经过后,触发的表单验证,红色加粗部分,你们写的时候能够直接用此部分)ui

     $(document).ready(function(){
            var $cashForm = $("#cashForm");

            //获取验证码按钮绑定点击事件
            $(".verIfi-btn").on("click",verification);

            $("#sms_check").click(function () {
                var smsCaptcha = $("input[name='smsCaptcha']").val();
                var smsCaptchaId = $("input[name='smsCaptchaId']").val();
                $.ajax({
                    url: "${base}/business/cash/sms_check",
                    type: "GET",
                    data:{
                        smsCaptchaId: smsCaptchaId,
                        smsCaptcha: smsCaptcha
                    },
                    dataType: "json",
                    cache: false,
                    success: function(message) {
                        if (message.check){
                            if(validateForm()){ $cashForm.submit(); }
                        }
                    }
                });
            });
        });

    三、验证一个单独的表单元素(校验规则写在空间中的时候使用)url

    例如:spa

<textarea id="ccomment" name="comment" maxlength="200" required></textarea>

    验证方法:code

    function validateForm() {
       $("#commentForm").validate().element($("#ccomment"));
    }
    
    function doSubmit(){  
       //do other things  
       //验证经过后提交  
       if(validateForm()){  
         $("#commentForm").submit()  
       }  
    }

    参考:http://layznet.iteye.com/blog/1168811orm

相关文章
相关标签/搜索