2012-02-08 20 views
1

私はMVC3を使用しており、必要な属性を持つモデル検証を追加しました。それからjqueryダイアログ(ajaxダイアログではない)を持つページを作成しました。その場合、検証は機能しません。しかし、私はダイアログからページにそれをうまく動作するHTMLを置く場合。モデル検証はjqueryダイアログでは機能しません

問題を解決する方法を身体が知っていますか?あなたは、ダイアログの内側に自分のフォームタグを移動する必要が

$(document).ready(function() { 
    $("#registerDialog").dialog({ autoOpen: false, show: "blind", hide: "explode", modal: true, resizable: false, height: 570, width: 390 }); 

    $(".headerButton").button(); 
    $(".accountBtn").button(); 
    $('ul').roundabout({ autoplay: 'false', autoplayDuration: 3000 }); 

    $("#registerBtn").click(function() { 
    $("#registerDialog").dialog("open"); return false; }); 
    $("#closeRegisterDialog").click(function() { $("#registerDialog").dialog("close"); 
    }); 

    $("#registerBtnSbmt").click(function() { 
    $("#registerForm").submit(); return false; }); 
    }) 



@using (Html.BeginForm("Register", "Account", FormMethod.Post, new { id = "registerForm" })) 
{  

    <div id="registerDialog" title="Регистрация"> 
     @Html.LabelFor(x => x.FirstName) 
     <br/> 
     @Html.TextBoxFor(x => x.FirstName, new { @class = "registerUser" }) 
     <br/> 
     @Html.ValidationMessageFor(x => x.FirstName)   
     <br/> 
     @Html.LabelFor(x => x.LastName)   
     <br/> 
     @Html.TextBoxFor(x => x.LastName, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.LastName)   
     <br/> 
     @Html.LabelFor(x => x.Email)   
     <br/> 
     @Html.TextBoxFor(x => x.Email, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Email)   
     <br/> 
     @Html.LabelFor(x => x.Password)   
     <br/> 
     @Html.TextBoxFor(x => x.Password, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Password)   
     <br/> 
     @Html.LabelFor(x => x.ConfirmPassword)   
     <br/> 
     @Html.TextBoxFor(x => x.ConfirmPassword, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.ConfirmPassword)         
     <br/> 
     @Html.CheckBoxFor(x => x.RememberYou) запомнить Вас?       
     <br/> 
     <br/> 
     @Html.ActionLink("Сохранить", "LogIn", "Account", null, new { @class = "accountBtn", style = "font-size: 0.8em;", id = "registerBtnSbmt" }) 
     <a href="#" class="accountBtn" id="closeRegisterDialog" style = "font-size: 0.8em;">Закрыть</a> 
    </div> 
} 
+0

あなたはダイアログ –

+0

$(文書)を生成するために使用するコードを投稿することができ.ready(関数(){ $( "#registerDialog")ダイアログ({ AutoOpenプロパティ。:偽、 ショー: "ブラインド"、 隠す: "爆発"、 モーダル:真、 サイズ変更可能:偽、 高さ:570、 幅:390 }); – Radislav

+0

$( "。headerButton")。button(); $( "。accountBtn")。button(); $( 'ul')です。ラウンドアバウト({autoplay: 'false'、autoplayDuration:3000}); $( "#registerBtn")クリック(function(){ $( "#registerDialog")ダイアログ( "open"); return false; }); $( "#closeRegisterDialog")。クリック(function(){ $( "#registerDialog")ダイアログ( "閉じる"); }); $( "#registerBtnSbmt")をクリックします(function {){ $( "#registerForm");return false; }); }); – Radislav

答えて

2

は、ここに私はJavaScriptです。ダイアログを作成して開くと、フォームからdivを移動します。あなたは望む:

<div id="registerDialog" title="Регистрация"> 
    @using (Html.BeginForm("Register", "Account", FormMethod.Post, new { id = "registerForm" })) 
    {  

     @Html.LabelFor(x => x.FirstName) 
     <br/> 
     @Html.TextBoxFor(x => x.FirstName, new { @class = "registerUser" }) 
     <br/> 
     @Html.ValidationMessageFor(x => x.FirstName)   
     <br/> 
     @Html.LabelFor(x => x.LastName)   
     <br/> 
     @Html.TextBoxFor(x => x.LastName, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.LastName)   
     <br/> 
     @Html.LabelFor(x => x.Email)   
     <br/> 
     @Html.TextBoxFor(x => x.Email, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Email)   
     <br/> 
     @Html.LabelFor(x => x.Password)   
     <br/> 
     @Html.TextBoxFor(x => x.Password, new { @class = "registerUser" })   
     <br/> 
     @Html.ValidationMessageFor(x => x.Password)   
     <br/> 
     @Html.LabelFor(x => x.ConfirmPassword)   
     <br/> 
     @Html.TextBoxFor(x => x.ConfirmPassword, new { @class = "registerUser" })    
     <br/> 
     @Html.ValidationMessageFor(x => x.ConfirmPassword)         
     <br/> 
     @Html.CheckBoxFor(x => x.RememberYou) запомнить Вас?       
     <br/> 
     <br/> 
     @Html.ActionLink("Сохранить", "LogIn", "Account", null, new { @class = "accountBtn", style = "font-size: 0.8em;", id = "registerBtnSbmt" }) 
     <a href="#" class="accountBtn" id="closeRegisterDialog" style = "font-size: 0.8em;">Закрыть</a> 
    } 
</div> 

このページから、このpage

の下部になぜ起こるかの説明があります:

ダイアログの要件の一つは、それが表示されていることです一番上の要素は です。 Internet Explorerでこれを一貫して達成する唯一の方法は、DOMインデックスのz-indexを尊重しているため、ダイアログボックスを 本文の最後の要素にすることです。 2 回避策は、一般的にあります。

move the dialog element back somewhere else in the dom in the open event callback. This has the potential to allow other elements to 

は、これらのいずれもが、ダイアログに構築するのに適している、と として残されている

move the dialog content element somewhere else in the dom in the close event callback, before the submit. 

(上記参照)ダイアログの上部に表示されます回避策を提案します。このチケットの最初のコメントとして、 が示唆しているように、これはより良い文書化が必要です。

+0

はい、動作します。おかげで多くのxbrady !!!!!!私はその問題を解決するのに2時間以上を費やしました。私はもっ​​と気配りしなければならない。 – Radislav

+0

歓迎します、これを答えにしてください。 – xbrady

+0

私はどうしているのかわかりません... – Radislav

1

まず最初に申し訳ありませんが申し訳ありませんので、答えに行ってください。モーダルウィンドウで

  1. はなく、これは、属性を[必須]を使用し、
  2. は、問題を解決するには...原因はページ必要がリフレッシュされ、そう、仕事、およびタイトルを変更しないで、可能ですメッセージのデフォルトを置き換えます。 注:(私は使用ASP.NET MVC 5よ、それは古いバージョンのいやに、HTML 5倍のための作品です)

enter image description here

:あなたがお奨め知識がおよそのコードを手放すモーダルウィンドウを作成することを認めます結果だ

enter image description here

関連する問題