使用AJAX保存时，jQuery模态表单验证不起作用

Question

我希望这里的一位专家能用我一直在开发的jQuery对话脚本为我指明正确的方向。

我的问题:当通过$.ajax()保存时，我不能让验证在我的对话框窗口中工作。如果我不通过AJAX保存，只提交表单，我的脚本就可以正常工作：

例如：$( this ).find(‘form#mws-validate event’).submit()；

如果任何人有时间查看我在下面留下的代码，并帮助验证部分，我将非常感激。我在stackoverflow上到处寻找，但还没有找到解决方案。

谢谢。

        $("#mws-addform-dialog").dialog({
                autoOpen: false, 
                title: "My Form / Add New", 
                modal: true, 
                width: "480",
            //working validation (NO AJAX)
            //buttons: [{
            //      text: "Submit", 
            //      click: function() {
            //          $( this ).find('form#mws-validate-event').submit();
            //      }}] 
            buttons: {
            "Submit": function() {

            },
            'Save': function() {

                $.ajax({
                    type : 'POST',
                    url : 'ajax.php?action=addnew',
                    data : $('#mws-validate-event').serialize(),
                    beforeSubmit : function (){
                        // Validate data before submit?? anyone??
                        //$( this ).find('form#mws-validate-event').submit();
                    },
                    success : function(data) {
                        // Show OK message
                        $('#mws-validate-event').find('.mws-form-message').html(data);
                        alert('ok');
                    },
                    error: function(error){
                        // Show error message
                        alert('error');
                    }
                });

            },
            'Cancel': function() {

                $(this).dialog("close");

            }
          } 
        });

        $("#mws-addform-dialog-btn").bind("click", function(event) {
            $("#mws-addform-dialog").dialog("option", {modal: true}).dialog("open");
            event.preventDefault();
        });
        //- modal form

        // validate form        
        $("#mws-validate-event").validate({
        //ignore: ".ignore",
            rules: {
                spinner: {
                    required: true, 
                    max: 5
                }

            }, 
            invalidHandler: function(form, validator) {
                var errors = validator.numberOfInvalids();
                if (errors) {
                    var message = errors == 1
                    ? 'You missed 1 field. It has been highlighted'
                    : 'You missed ' + errors + ' fields. They have been highlighted';
                    $("#mws-validate-error").html(message).show();
                } else {
                    $("#mws-validate-error").hide();
                    }
            }
        });
        //- validate form 

Answer 1

您是否尝试过使用jquery验证器进行验证？它为您完成了大部分验证工作，并且易于使用。

http://bassistance.de/jquery-plugins/jquery-plugin-validation/