2012-06-05 32 views
0

我希望這裏的專家之一,可以點我有我一直在一個jQuery對話框腳本正確的方向保存時不工作..jQuery的模態窗體驗證與AJAX

我的問題:我能當通過$ .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 

回答

0

您是否嘗試過使用jquery驗證器進行驗證?它爲你做了大部分驗證工作,並且易於使用。

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