2011-08-10 14 views
13

MVC3で動作するように検証するのに苦労しています。私は直接、ページをロードするときには正常に動作しますが、私はjqueryのAJAX POSTを使用する場合、それは検証しません:jvery ajax投稿でmvc 3で邪魔にならない妥当性検証に問題がある

このフォームは$('#modal-dialog').load('/DartsMVC/Restaurant/Edit/13')を使用してロードされ、これがレンダリングされたHTMLです:

<form action="/DartsMVC/Restaurant/Edit/13" method="post"> 
    <fieldset> 
     <legend>Restaurant</legend> 

     <input data-val="true" data-val-number="The field RestaurantID must be a number." data-val-required="The RestaurantID field is required." id="RestaurantID" name="RestaurantID" type="hidden" value="13"> 

     <div class="editor-label"> 
      <label for="Name">Name</label> 
     </div> 
     <div class="editor-field"> 
      <input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" name="Name" type="text" value="furaibo"> 
      <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span> 
     </div> 

     <p> 
      <input type="submit" value="Save" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false"> 
     </p> 
    </fieldset> 
</form> 

AJAX POSTがありますフォーム/サブミットをインターセプトすることによって使用されます。ポストが完了すると、モーダルダイアログがポップアップして閉じます。私はポストを送信する前にフォームを検証したいと思います:

// force change the submit data to an ajax POST (usually 'save', 'delete' button) 
$('#modal-dialog').delegate('form', 'submit', function (e) { 
    e.preventDefault(); 
    var form = $(this); 
    form.validate(); // does nothing 
    if (form.valid()) { 
     $.ajax({ 
      url: form.attr('action'), 
      type: "POST", 
      data: form.serialize(), 
      success: function (data) { 
       $('#modal-dialog').dialog('close'); 
      }, 
      error: function (jqXhr, textStatus, errorThrown) { 
       alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')"); 
      } 
     }); 
    } 
}); 

私はこれを行うことによって、何かを壊していましたか? .valid()は常にtrueを返します。

マイページのソースがあります:

私のweb.configファイルがあり

<link href="/DartsMVC/Content/themes/cupertino/jquery-ui-1.8.14.custom.css" rel="stylesheet" type="text/css"> 

<script src="/DartsMVC/Scripts/modernizr-1.7.min.js" type="text/javascript"></script> 
<script src="/DartsMVC/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script> 
<script src="/DartsMVC/Scripts/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script> 

<script src="/DartsMVC/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> 
<script src="/DartsMVC/Scripts/jquery.validate.js" type="text/javascript"></script> 
<script src="/DartsMVC/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script> 

そして、私のモデルがあります:

[Required] 
    public string Name { get; set; } 

は、より多くの研究の後、私はそれを持っているかもしれないと思いますダイナミックコントロールとは何か:

答えて

26

は($( 'フォーム'))$ .validator.unobtrusive.parseを呼び出す

を解決しましたトリック。ダイナミックコンテンツ用にバリデーターを再作成する必要があると思います。

+0

ありがとう!私はこれをもう少し前には分かっていましたが、forogtは解決策を再度見つけるのに苦労しました。 –

+0

@juhan_h上記の$ .validatorコードはどこでコード内で呼び出されますか?私は同様の問題かもしれません:、機能(formToAdd){ \t \t \t jQuery.each(formToAdd: '//は控えめな検証に \t \t addValidationToFormを再初期化:/ – Elisabeth

+1

@Elisaを、私は控えめな検証を再初期化するためにAddRemoveValidator機能を作成することになりました関数(I、形態){ \t \t \t \t $(フォーム).removeData( "バリ"); \t \t \t \t $ .validator.unobtrusive.parse(フォーム); \t \t \t})。 (formsToRemoveFrom中からVAR){ \t \t \t \t $(から)のための関数(formToAdd、formsToRemoveFrom){ \t \t \t: \t \t}、 \t \t addValidationToFormRemoveFromOthers。removeData( "validator"); \t \t \t} \t \t \t global.addValidationToForm(formToAdd)。 \t \t} ' –

関連する問題