2016-10-04 96 views
0

我使用的是默認的Web應用程序的MVC項目,我試圖登錄/從模式寄存器:如何登錄/從引導模式註冊而不重定向?

enter image description here

所以我做了包含登錄模型的新模式,並註冊

public class LogInRegisterViewModel 
    { 
     public LoginViewModel login { get; set; } 
     public RegisterViewModel register { get; set; } 
    } 

然後在我的佈局頁面我提供用於登錄的局部視圖沿模型/註冊:

<div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav">      
       @if (User.Identity.IsAuthenticated) 
       { 
        <li>@Html.ActionLink("MyUploads", "Index", "Tutorials")</li> 
        <li>@Html.ActionLink("Upload", "Create", "Tutorials")</li> 
       } 
      </ul> 

      @Html.Partial("_LoginPartial",model) @*model = new LogInRegisterViewModel()*@ 
     </div> 

爲模態的HTML代碼是我_LoginPartial視圖(也許這是我的錯?),以及登錄和註冊表格(從賬戶控制器複製):

<div class="modal fade" id="myModal" tabindex="-1" role="dialog"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content mc"> 
       <div class="modal-body"> 
        <div class="row"> 
         <div class="col-md-6 login-modal"> 
          <section id="loginForm"> 
           @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" })) 
           { 
            @Html.AntiForgeryToken() 
            <h4>Use a local account to log in.</h4> 
            <hr /> 
            @Html.ValidationSummary(true, "", new { @class = "text-danger" }) 
            <div class="form-group"> 
             <div> 
              <h5 class="user-name login-labels"><i class="fa fa-user" aria-hidden="true"></i> User Name</h5> 
             </div> 
             <div class="col-md-8 login-input"> 
              @Html.TextBoxFor(m => m.login.UserName, new { @class = "form-control" }) 
              @Html.ValidationMessageFor(m => m.login.UserName, "", new { @class = "text-danger" }) 
             </div> 
            </div> 
            <div class="form-group"> 
             <h5 class="user-password login-labels"><i class="fa fa-lock" aria-hidden="true"></i> Password</h5> 
             <div class="col-md-8 login-input"> 
              @Html.PasswordFor(m => m.login.Password, new { @class = "form-control" }) 
              @Html.ValidationMessageFor(m => m.login.Password, "", new { @class = "text-danger" }) 
             </div> 
            </div> 
            <div class="form-group"> 
             <div class="col-md-10 login-btn"> 
              <input type="submit" value="Log in" class="btn btn-primary" /> 
             </div> 
            </div> 
            @* Enable this once you have account confirmation enabled for password reset functionality 
             <p> 
              @Html.ActionLink("Forgot your password?", "ForgotPassword") 
             </p>*@ 
           } 
          </section> 
         </div> 
         <div class="col-md-6"> 
          @using (Html.BeginForm("Register", "Account", FormMethod.Post, new { @class = "form-horizontal", role = "form" })) 
          { 
           @Html.AntiForgeryToken() 
           <h4>Create a new account.</h4> 
           <hr /> 
           @Html.ValidationSummary("", new { @class = "text-danger" }) 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.FirstName, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.TextBoxFor(m => m.register.FirstName, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.LastName, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.TextBoxFor(m => m.register.LastName, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.ProfileAvatar, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.TextBoxFor(m => m.register.ProfileAvatar, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.Email, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.TextBoxFor(m => m.register.Email, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.Password, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.PasswordFor(m => m.register.Password, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            @Html.LabelFor(m => m.register.ConfirmPassword, new { @class = "col-md-2 control-label" }) 
            <div class="col-md-10"> 
             @Html.PasswordFor(m => m.register.ConfirmPassword, new { @class = "form-control" }) 
            </div> 
           </div> 
           <div class="form-group"> 
            <div class="col-md-offset-2 col-md-10"> 
             <input type="submit" class="btn btn-default" value="Register" /> 
            </div> 
           </div> 
          } 
         </div> 

        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        </div> 
       </div><!-- /.modal-content --> 
      </div><!-- /.modal-dialog --> 
     </div><!-- /.modal --> 
    </div> 

現在如果你點擊登錄按鈕,而不提供用戶名和密碼,頁面會將我重定向到帳戶/登錄,與註冊表相同。

那麼我該如何解決這個問題,這樣的驗證錯誤彈出模態,而不是重定向到帳戶控制器?

在此先感謝您的幫助。

回答

1

確保首先你已經包含了腳本來實際驗證表單:

<script src=".../Scripts/jquery.validate.js"></script> 
<script src=".../Scripts/jquery.validate.unobtrusive.js"></script> 
1

對於客戶端驗證,在您的視圖或佈局中包含jQuery驗證包。

@section scripts 
{ 
    @Scripts.Render("~/bundles/jqueryval") 
} 

此外,您還可以使用Ajax.BeginForm()輔助而不是Html.BeginForm來實現您的註冊和登錄表單。

相關問題