CODEWITHSUNDEEP
asp.net-mvc-4
Shaik
Shaik

Reputation: 63

Working with multiple html helpers of same name in mvc4

I have multiple html helpers. When I click login button I am disabling user_register div using jquery and when I enter details the username and password the model binder is able to bind properly but when I click Register I am disabling user_login div and enabling user_register div and when I enter the details only email and firstname is what the model binder is able to bind and not username, password. Is this becoz I am using the same html helpers more than once. How to handle this. I have the following code

<div class="user_login">
 <label>Email / Username</label>
   @Html.TextBoxFor(model => model.Email)
   <br />
   <label>Password</label>
   @Html.TextBoxFor(model => model.Password)                                       
    <br />    
     <div class="action_btns">
      <div class="one_half"><a href="#" class="btn back_btn"><i class="fa fa-angle-double-left"></i>Back</a>
      </div>
     <div class="one_half last">
      <input type="submit" style="border: none" name="action" class="btn btn_red" value="Login" />
      </div>
     </div>
     <a href="#" class="forgot_password">Forgot password?</a>
  </div>
  <div class="user_register">
    <label>Full Name</label>
     @Html.TextBoxFor(model => model.First_Name)<br />
     <label>Email Address</label>
     @Html.TextBox(model=>model.Email)<br />
      <label>User Name</label>
      @Html.TextBoxFor(model => model.User_Name)<br />
      <label>Password</label>
      @Html.TextBox(model=>model.Password") <br />
  </div>

The controller follows here

public ActionResult Index(Customer customer, string Action)
{
 //something here
}

Upvotes: 3

Views: 523

Answers (1)

user3559349
user3559349

Reputation:

You have not shown you complete view, but assuming all those controls are generated inside one form element, then all controls will post back unless you make the inputs disabled. If so, then the first input with name="Email" is bound and the second one is ignored by the DefaultModelBinder. (since the first one is only hidden, its value is probably empty). Your script needs to ensure that the 2 inputs in the login section are disabled, for example

@Html.TextBoxFor(model => model.Email, new { id = "login-email" })

and

$('#login-email').prop('disabled', true);

Note the id attribute so you can select the correct one (and prevent duplicate id's which is invalid html.

An alternative would be to create 2 separate forms.

Upvotes: 1

Related Questions