表单验证不会发生,表单提交

时间:2013-07-10 02:09:19

标签: jquery jquery-validate

这是我正在处理的登录页面的javascript。 因此,出于某种原因,我的表单在发送表单之前不会进行验证,而且还会破坏我的后台旋转插件。 希望有人能够帮我解决这个问题,对不起,如果这篇文章太长了,我似乎无法正确提交这篇文章,因为它一直要求我添加更多细节,但我真的不知道是什么否则加入。

var Login = function () {

    return {
        //main function to initiate the module
        init: function () {

            $.backstretch([
                "assets/img/bg/1.jpg",
                "assets/img/bg/2.jpg",
                "assets/img/bg/3.jpg",
                "assets/img/bg/4.jpg"
                ], {
                  fade: 1000,
                  duration: 8000
              });

            $('.login-form').submit(function(e) {
            e.preventDefault();
            }).validate({
                errorElement: 'label', //default input error message container
                errorClass: 'help-inline', // default input error message class
                focusInvalid: false, // do not focus the last invalid input
                rules: {
                    username: {
                        required: true
                    },
                    password: {
                        required: true
                    },
                    remember: {
                        required: false
                    }
                },

                messages: {
                    username: {
                        required: "Username is required."
                    },
                    password: {
                        required: "Password is required."
                    }
                },

                invalidHandler: function (event, validator) { //display error alert on form submit   
                    $('.alert-error', $('.login-form')).show();
                },

                highlight: function (element) { // hightlight error inputs
                    $(element)
                        .closest('.control-group').addClass('error'); // set error class to the control group
                },

                success: function (label) {
                    label.closest('.control-group').removeClass('error');
                    label.remove();
                },

                errorPlacement: function (error, element) {
                    error.addClass('help-small no-left-padding').insertAfter(element.closest('.input-icon'));
                },

                submitHandler: function (form) {
                    $.ajax({
                    url: "loginqry.php",
                    type: "post"
                    data: serializedData
                    {
                    alert(data); // show response from the php script.
                    }
                    });
                    return false;
                }
            });

            $('.login-form input').keypress(function (e) {
                if (e.which == 13) {
                    $.ajax({
                    url: "loginqry.php",
                    type: "post"
                    data: serializedData
                    {
                    alert(data); // show response from the php script.
                    }
                    });
                    return false;
                }
            });
        }

    };

}();

1 个答案:

答案 0 :(得分:0)

您无法将.validate() method链接到事件处理程序...

$('.login-form').submit(function(e) {
    e.preventDefault();
}).validate({...});

此外,没有理由首先声明.submit()处理程序。该插件会自动处理您将其绑定到的表单的提交事件。

只需这样做......

$('.login-form').validate({...});