Question

I have partial view inside another view.
The partial view is ‘logon’ partial. and i am using jquery validation.
please see the attached image.

Here the requirement is, who is already signed up, they will enter username/password and proceed to next page. (in the logon partial view)
And those who are not signedup yet, they will enter email/password/fullname and proceed to next page.(in the main view)

In the main view there are few required fields. for example: email, password and so on.
Now the problem is, if i enter username/password in the logon partial view,
it does not allow me to proceed. It gives me error for the required fields in the main view.

And this happens only in I.E.
In FF and Crome it works as i want.

Any idea what to do in this case??

CODE:
Logon Partial:

<script src="<%: Url.Content("~/Scripts/jquery.validate.min.js") %>"    type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js") %>"     type="text/javascript"></script>

<% using (Html.BeginForm("LogOn", "Account", new { returnUrl =     Request.QueryString["returnUrl"] }))
 { %>

<div>
        <div class="editor-label">
            <%:Html.Label("Email") %>

        </div>
        <div class="editor-field">

             <%:Html.TextBoxFor(m => m.UserName, new { style = "width:350px;" })%>
        </div>
        <div class="editor-label">
             <%:Html.LabelFor(m => m.Password)%>
        </div>
        <div class="editor-field">

            <%:Html.PasswordFor(m => m.Password, new { style = "width:350px;" })%> 
        </div>
        <p>
            <input type="image" value="Log On" title="Log On"     src="../../Content/images/signinnew.png"/>
        </p>
</div>
<%} %>

The main view:

<script type="text/javascript">
$(document).ready(function () {

    <%if (User.Identity.IsAuthenticated)
    { %>
        $("#logindata").hide();

    <%}
    else
    {%>
    $('#logindata').load("/Account/LogOn?returnUrl= <%:HttpContext.Current.Request.RawUrl%>"); 
    <%} %>
</script>

<%using (Html.BeginForm())
 { %>
<fieldset>
    <legend></legend>

     <div id="logindata" style="border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #CCCCCC;margin-bottom:10px;">
         **// I am loading the logon partial view here.**
     </div>


     <div class="editor-label">
        <%: Html.LabelFor(m => m.DeliveryInfo.Email)%>
     </div>
     <div class="editor-field">
        <%: Html.TextBoxFor(m => m.DeliveryInfo.Email)%>    
     </div>
     <div id="tohide">
     <div class="editor-label">
        <%: Html.LabelFor(m => m.DeliveryInfo.Password)%>
     </div>
     <div class="editor-field">
        <%: Html.PasswordFor(m=>m.DeliveryInfo.Password)%>    
     </div>
     <div class="editor-label">
        <%: Html.LabelFor(m => m.DeliveryInfo.ConfirmPassword)%>
     </div>
     <div class="editor-field">
        <%: Html.Password("ConfirmPassword")%>    
        <br />
        <%:Html.ValidationMessageFor(m=>m.DeliveryInfo.ConfirmPassword) %>
     </div>
     </div>
     <div class="editor-label">
        <%: Html.Label("Fullname")%>
     </div>
     <div class="editor-field">
        <%: Html.TextBoxFor(m => m.DeliveryInfo.Name)%>    
     </div>         
</fieldset>    
</div>
<%}%>

Answer 1

I can see your Html.BeginForm for the Partial view but I can’t see the one for the Main view so I assume that Html.BeginForm covers the Partial view as well which would always result in the required fields being triggered when the submit button is pressed for the Partial view.

<div id="logindata" style="border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color:    
     #CCCCCC;margin-bottom:10px;">
     **// I am loading the logon partial view here.**
 </div>

<% using (Html.BeginForm("ActionMethod", "Controller"))
   { %>
     <div class="editor-label">
        <%: Html.LabelFor(m => m.DeliveryInfo.Email)%>
     </div>
     ......

 <%} %>
 </fieldset>