结合MicrosoftMvcJQueryValidation和Ajax提交

我遇到了麻烦，试图在我想通过Ajax调用提交数据的表单中应用MS JQuery验证。我使用DataAnnotations和MicrosoftMvcJQueryValidation.js库来执行客户端和服务器端验证。结合MicrosoftMvcJQueryValidation和Ajax提交

服务器验证的伟大工程，我试图通过

 <% Html.EnableClientValidation(); %> 
    <%= Html.ValidationSummary("Create was unsuccessful. Please correct the errors and try again.") %> 

    <div id="formContainer"> 
     <% using(Html.BeginForm()){ %> 

      <table class="formTable" width="100%" border="0" cellspacing="0" cellpadding="0"> 

      <tr> 
       <td><label for="Description">Description:</label></td> 
       <td><%= Html.TextBox("Description", Model.Description) %> 
       <%= Html.ValidationMessage("Description", "*") %></td> 
      </tr> 
      <tr> 
       <td> </td> 
       <td> 
       <%=Html.Button("cancelBtn","Cancel")%> 
       <input id='createBtn' class='button' type='button' value='Create' /> 
       </td> 
      </tr> 

      </table> 
     <% } %> 

    </div>

onclick事件平均以启用客户端验证，然后通过自定义的Ajax调用管理。在我的网页源我可以看到部分

//<![CDATA[EnableClientValidation(...)]

但我想实际的Ajax调用之前验证数据。

在相反通过使用提交输入和

inputCreate.submit(function() {$.ajax...});

进行客户端验证，但不执行AJAX调用，形式是通过回发提交。

有什么办法可以让它们一起工作而不用改变jQuery.validate库吗？

可能吗？我对此采用了错误的方法吗？

在此先感谢

来源

2009-11-03 Mauro

我没有找到任何解决办法如何使用MicrosoftMvcJQueryValidation.js到AJAX提交表单，而无需修改它。这里是我的解决方法：

1）加入 “MicrosoftMvcJQueryValidation.js” 文件如下因素代码，只是 “theForm.validate(options);” 在"function __MVC_EnableClientValidation(validationContext)“前：

2）使用这个js函数来自己的选项添加到.validate()方法：

function setFormValidationOptions(formId, options) { 
    if (typeof (formId) == undefined || formId == null || typeof (options) == undefined || options == null) return; 
    if (window.mvcClientValidationMetadata) { 
     for (i = 0; i < window.mvcClientValidationMetadata.length; i++) 
      if(window.mvcClientValidationMetadata[i].FormId == formId) 
       window.mvcClientValidationMetadata[i].validationOptions = options; 
    } 
}

3）到AJAX提交形式使用：

valOpt = { 
    submitHandler: function(form) { 
     $(form).ajaxSubmit({ 
      target: "#output" 
     }); 
    } 
}; 
setFormValidationOptions("myFormId", valOpt);

请记住，您可以为.validate（）函数添加任何有效的options。必须加载jquery.validate和jquery.forms插件。

希望它有帮助。

来源

2010-02-05 11:17:15 Feryt

绝对有帮助，谢谢。我讨厌编辑MicrosoftMvcJQueryValidation.js，但现在我终于可以通过DataAnnotations来使用客户端验证，而无需依赖Ajax.BeginForm（）方法，而无需使用所有额外的MicrosoftAjax处理程序。 – kdawg 2010-07-29 14:34:54

$("input#createBtn").click(function() { 
    theform = $(this).closest("form"); 
    if (theform.validate().form()) { 
     jQuery(theform).ajaxSubmit({ 
      target: "#formContainer" 
     }); 
    } 
    else { 
     return false; 
    } 
});

来源

2010-06-02 15:43:23

谢谢，这对我有用。我真的不想更改MicrosoftMvcJQueryValidation.js – Richard 2010-10-14 12:29:03

结合MicrosoftMvcJQueryValidation和Ajax提交

回答

相关问题