Проверка модели не работает в диалоговом окне jquery

Question

Я использую MVC3 и добавил проверку модели с обязательными атрибутами. Затем я создал страницу с диалогом jquery (не ajax). В этом случае проверка не работает. Но если я поместил html из диалога на страницу, он отлично работает.

Любое тело знает, как решить проблему?

Вот мой JavaScript:

$(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> 
} 

Answer 1

Вы должны переместить тег формы внутри вашего диалога. Вы заметите, что когда вы создаете диалог и открываете его, он перемещает ваш 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-индексу. Существуют два обходные:

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. 

Ни один из них пригодны для строительства и диалога, и влево, предлагаемые рабочие места. Как говорится в первом комментарии к этому билету , это должно быть документировано лучше.

Answer 2

Во-первых, извините, что не ответили ранее, поэтому перейдите к ответу.

1. в модальном окна, не возможно, это не работает, потому что необходимо обновить страницу, так что ...
2. Чтобы решить эту проблему, используйте атрибут [требуется], и изменить заголовок замените значение messagem по умолчанию. Примечание: Допуская, что вам нужно знание о создании модального окна пойдём код: (я использовать ASP.NET MVC 5, это работает для HTML 5x, к старой версии Нету)

Вот результат: