asp.net mvc3 jquery uiダイアログとクライアントの検証

Question

私はasp.net mvc3アプリケーションでクライアントの検証に問題があります。

私のコードでは、なります

function loadEditCategoryDialog(categoryId) { 
    $.ajax({ 
     url : "/rovastamp3/Admin/CategoryEditDialog", 
     data : "categoryId="+categoryId, 
     success : function(data){ 
      $("#popup_dialog").html(data); 
      $("#popup_dialog").dialog({   
       modal: true, 
       draggable: false, 
       resizable: false, 
       title: "Upravit kategorii", 
       width: 600, 
       height: 500, 
      });        
     } 
    }); 
} 

コントローラー：

[HttpGet] 
public ActionResult CategoryEditDialog(int categoryId) 
{ 
    CategoryEditViewModel categoryEditViewModel = new CategoryEditViewModel(); 
    categoryEditViewModel.Category = _postAuctionCategoryRepo.Query() 
     .SingleOrDefault(x => x.Id == categoryId); 

    return PartialView(categoryEditViewModel); 
} 

[HttpPost] 
public ActionResult CreateNewCategory(CategoryEditViewModel categoryEditViewModel) 
{ 
    if (ModelState.IsValid) 
    { 
     return RedirectToAction("Index"); 
    } 
    return View("CategoryEditDialog", categoryEditViewModel); 
} 

そして最後に、私の部分図：私のweb.configファイルで

@model Rovastamp.MVC3.ViewModels.AdminController.CategoryEditViewModel 
<h2>Upravit kategorii @Model.Category.Name</h2> 
@{Html.EnableClientValidation();} 
@using (Html.BeginForm("CreateNewCategory", "Admin")) 
{ 
    @Html.ValidationSummary(true) 
    <fieldset> 
     <legend>Objednávkový formulář</legend> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Category.Name) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(model => model.Category.Name) 
      @Html.ValidationMessageFor(model => model.Category.Name) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Category.Position) 
     </div> 
     <div class="editor-field"> 
      @Html.TextBoxFor(model => model.Category.Position) 
      @Html.ValidationMessageFor(model => model.Category.Position) 
     </div> 

     <input type="submit" value="Upravit" class="submit_button" />    
    </fieldset> 
} 

私はUnobtrusiveJavaScriptとClientValidatinアプリの設定をオンに。

jquery UIダイアログのサブミットボタンをクリックすると、mvcはクライアントの検証なしで完全に更新されますか？

問題はどこですか？私のレイアウトページで

私はこのスクリプトを含める：

• jquery.unobtrusive-ajax.js
• jquery.validate.js
任意のヘルプ

EDITため

感謝

• jquery.validate.unobtrusive.js

私exemapleでEDIT 2

は私が入れ：

私はjqueryのUIダイアログとクライアント検証呼び出す前に

jQuery.validator.unobtrusive.parse('#popup_dialog'); 

は完璧に動作します。

Answer 1

ことがありますPartial Viewをjquery.validator.unobstrusiveライブラリですでに解析済みのビューに変換します。挿入されたPartialView検証属性を考慮に入れて、ページを再解析するようにライブラリに指示する必要があります。件名に私のthis blog postを読んで、あなたの質問にうまく答えるでしょう。

Answer 2

クライアント側の検証に適切なJavaScriptファイルが含まれていますか？

チェックあなたが提出するアクションを実行するJavaScriptコンソール、私はそれにはJavaScriptを出てエラーにして、フォームのデフォルトアクションはで蹴っている提出する原因となっていますが、エラーがあります賭け。あなたがロードされているので

Answer 3

私はこの問題で苦労しました 数時間後、jQueryはDIALOG HTML要素をフォーム要素の外にレンダリングすると結論づけました。 jQuery以降。以下のようなあなたの送信ボタンをアップ配線に加えて

$('#dialogDivId').dialog({ 
     autoOpen: false, 
     width: 500, 
     height: 500, 
     minheight: options.minheight, 
     minwidth: options.minwidth, 
     modal:false, 
     open: function (type, data) { 
      $(this).appendTo($('form')); // reinsert the dialog to the form 
     } // And Solve your validation inside Jquery dialog 
}); 

Answer 4

：検証プラグインは、これは以下のオープンイベント処理によって行うことができ、Formスコープ内のダイアログをバック戻す必要がある 、唯一のFORM要素内で動作しますso

$("#SubmitButton").click(function(){ 
    if (!$("#editForm").valid()){ 
     return false; 
    } 
     }); 

デフォルトのコンストラクタを使用して解析するhtmlフォームを特定する必要があります。

$.validator.unobtrusive.parse("#editForm"); 

私はあなたが、それぞれが、それぞれのフォーム上のボタンを提出し、私は道を見つけた場合、ここで掲載しますアップ配線する必要がないようにする方法を把握しようとしています。