Using one view for login/register with two controllers

Question

I'm using a bootstrap login/Registration form and I had to make some changes to my code since it is all happening in one view, so first I had two separated models LoginViewModel and RegisterViewModel, I created another view model called it loginRegisterViewModel

  public class LoginRegisterViewModel
{
  public LoginViewModel LoginViewModel { get; set; }
  public  RegisterViewModel RegisterViewModel { get; set; }
}

this is part of my View

@using Saff.Models
@model LoginRegisterViewModel
@{
    ViewBag.Title = "Log in";
 }

      @using (Html.BeginForm("Login", "Account", new { ReturnUrl = 
      ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-
     horizontal", role = "form" }))
        {
@Html.AntiForgeryToken()


<div class="body-content">
<div class="container">
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="row">
        <div class="col-md-6">
            <div class="panel with-nav-tabs panel-info">
                <div class="panel-heading">
                    <ul class="nav nav-tabs">
                        <li class="active"><a href="#login" data-toggle="tab"> Login </a></li>
                        <li><a href="#signup" data-toggle="tab"> Signup </a></li>
                    </ul>
                </div>
                <div class="panel-body">
                    <div class="tab-content">
                        <div id="login" class="tab-pane fade in active register">
                            <div class="container-fluid">
                                <div class="row">
                                    <h2 class="text-center" style="color: #5cb85c;"> <strong> Login  </strong></h2><hr />
                                    <div class="row">
                                        <div class="col-xs-12 col-sm-12 col-md-12">
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <div class="input-group-addon">
                                                        <span class="glyphicon glyphicon-user"></span>
                                                    </div>

                                                    <div class="form-group">
                                                        @Html.LabelFor(m => m.LoginViewModel.Email, new { @class = "col-md-2 control-label" })
                                                        <div class="col-md-10">
                                                            @Html.TextBoxFor(m => m.LoginViewModel.Email, new { @class = "form-control" })
                                                        </div>
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                 ..............

this is the login and register action methods

  [HttpPost]
    [AllowAnonymous]
    [ValidateAntiForgeryToken]
    public async Task<ActionResult> Login(LoginRegisterViewModel model, string returnUrl)
    {
        if (!ModelState.IsValid)
        {
            return View(model);
        }
        .......//more code here
    }
    [HttpPost]
    [AllowAnonymous]
    [ValidateAntiForgeryToken]
    public async Task<ActionResult> Register(LoginRegisterViewModel model)
    {
        if (ModelState.IsValid)
        {
        .....//more code here
    }

as you can see I changed the models in both of them

So my question is how can I connect the register and login methods to the same view, the login is already connected since it is the one I modified, still when I press the login submit button it is not actually working and I don't go any where. does it have to do with me changing the name of the model in the controller? I don't know, but I need some help here

Why are you doing this. A user only ever registers once so why degrade performance by generating all that extra html when its never needed. Just have a login form and a link to a register form, of use ajax to call a server method that returns a view of the register form and update the DOM with it. — , Nov 19 '17 at 00:47
Thanks for your advice, I think you are right. that was my previous situation, I don't know I thought it was more fancy and I didn't think about efficiency. — salRad, Nov 19 '17 at 07:02
OK so just to have things clear, I used to have separated login and registration pages now I'm going to use ajax so I can load both of the contents at the same page, but what do you mean" update the DOM"? — salRad, Nov 20 '17 at 09:41
I would suggest that you initial view be based on `LoginViewModel` (and in the view a form for it that posts back to `Login(LoginViewModel model)`. Then you have a link or button that makes a call to a `[ChildActionOnly]` method that returns a partial view of the `Register` form (and post back to a `Register(RegisterViewModel model)`. In the ajax callback you just replace the Login form with the Register form — , Nov 20 '17 at 09:46
You will also need to reparse the validator for client side validation (refer [this answer](https://stackoverflow.com/questions/31768946/required-field-validations-not-working-in-jquery-popup-mvc-4/31769058#31769058) for an example — , Nov 20 '17 at 09:48
Thank you for your quick response, I'll check it out and let you know how it went...Thanks again! — salRad, Nov 20 '17 at 10:09

Using one view for login/register with two controllers

0 Answers0