• jquery validate 插件使用小结


    项目中整合了jquery validate插件,仿照别人的使用写了我的表单验证,结果不起作用。然后就各种找原因。

    在网上下了jquery validate插件的完整包,看了看里边的例子,跟我的使用貌似没什么差别。

    后来才想起来,以前在这个项目某个功能中使用validate插件的时候,貌似有过类似的问题,一时又想不起来问题出在哪。然后就回去找原来的代码看。

    恍然大悟,例子中的表单验证是普通的表单提交,而我的表单提交是jquery ajax提交。想起来validate默认的验证触发事件是表单的submit事件。那么这应该是问题所在。

    然后按照ajax提交调用validate验证的方式修改了我的表单验证。表单的验证代码如下(ajax方式提交表单)

    $("#sendForm").validate({
                submitHandler : function(form) {
                    $(form).find(':submit').attr('disabled', true);
                    preSubmit();
                    $.ajax({
                        url            : "file_send_submit.jspx",
                        type        : "post",
                        dataType    : "json",
                        data        : $("#sendForm").serialize(),
                        success        : function(msg) {
                            if(msg.success=='true') {
                                alert("提交成功!");
                                afterSubmit(true);
                            } else {
                                alert("提交失败!");
                                afterSubmit(false);
                            }
                        },
                        error        : function() {
                            alert("提交出错!");
                            afterSubmit(false);
                        }
                    });
                }
            });

    这段验证代码是按照之前的成功例子修改的。但是表单依然不验证。

    不解。

    折腾了老半天,问题总算找到了,<input class="edit_input w_332" maxlength="100" type="text" name="sendName" id="sendName" class="required“/>,这是我原来的输入框写法,然后改成了<input class="edit_input w_332 required" maxlength="100" type="text" name="sendName" id="sendName"/>,输入框变成了必须输入,验证生效。这算是一个不规范的写法引起的吧,泪奔啊,让我闹心了那么久。

  • 相关阅读:
    Prometheus监控学习笔记之Prometheus监控简介
    GO语言学习笔记之Linux环境下安装GO语言
    Jetson tx1 安装ROS
    ssh Jetson tk1
    Jetson tk1 安装 Intel 7260 无线网卡驱动
    ubuntu 14.04 软件中心闪退解决方案
    Jetson tk1 刷机后要做的几件事
    Jetson tk1 安装 usbtoserials 驱动(重新刷机)
    usbserials
    ubuntu 14.04 安装 eclipse
  • 原文地址:https://www.cnblogs.com/keanuyaoo/p/3297318.html
Copyright © 2020-2023  润新知