2

Ajax呼び出しを介してデータを送信したいフォームにMSJQuery検証を適用しようとすると問題が発生します。DataAnnotationsとMicrosoftMvcJQueryValidation.jsライブラリを使用して、クライアント側とサーバー側の検証を実行しています。

サーバーの検証はうまく機能し、クライアントの検証を有効にしようとしています。

     <% 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-callは実行されず、フォームはポストバックを介して送信されます。

jQuery.validateライブラリを変更せずにそれらを連携させる方法はありますか?

出来ますか?私はこれに間違ったアプローチを使用していますか?

前もって感謝します

4

2 に答える 2

3

MicrosoftMvcJQueryValidation.jsを使用して、フォームを変更せずにajax送信フォームを作成する方法が見つかりませんでした。これが私の回避策です:

1)""の""MicrosoftMvcJQueryValidation.jsの直前の""ファイルに次のコードを追加します:theForm.validate(options);"function __MVC_EnableClientValidation(validationContext)

if (typeof (validationContext.validationOptions) != undefined && validationContext.validationOptions != null) $().extend(options, validationContext.validationOptions);

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()関数に有効なオプションを追加できることを忘れないでください。jquery.validateプラグインとjquery.formsプラグインの両方をロードする必要があります。

それが役に立てば幸い。

于 2010-02-05T11:17:15.077 に答える
3
$("input#createBtn").click(function() {
    theform = $(this).closest("form");
    if (theform.validate().form()) {
        jQuery(theform).ajaxSubmit({
            target: "#formContainer"
        });
    }
    else {
        return false;
    }
});
于 2010-06-02T15:43:23.090 に答える