Remote Validation working elsewhere

Question

I have a user registration page where I implemented the remote validation concept for the Username. I basically want to keep each Username a unique value. I was able to achieve it, but now in the login page, when I type the username it prompts a message saying the Username is not available. This was meant just for the registration page and not the login page. Could someone please explain what is the mistake I am doing. I have a Model User which has a Username property; to which I am using the remote validation. I have an Action method called UserNameExsists which gets triggered for the remote validation. And the Registration view which utilities the validation. But the validation is being triggered for the login page as well. Is there a way I could set it up just for the Registration View?

Model:

public class User
{
    public int ID { get; set; }
    [Required]
    [Remote("UserNameExists","User",ErrorMessage="Username not available")]
    [Display(Name="User Name")]
    public string UserName { get; set; }
    [Required]
    [DataType(DataType.Password)]
    public string Password { get; set; }
    [Required]
    [Display(Name="First Name")]
    public string FirstName { get; set; }
    [Required]
    [Display(Name="Last Name")]
    public string LastName { get; set; }
    [Required]
    [DataType(DataType.PhoneNumber)]
    [MinLength(10)]
    [MaxLength(10)]
    [Display(Name="Mobile No")]
    public string PhoneNum { get; set; }
}

Controller: (Name is User)

    //Remote Validation
    public JsonResult UserNameExists(string username)
    {
        bool user = db.Users.Any(p => p.UserName == username) ? false : true;
        return Json(user,JsonRequestBehavior.AllowGet);

    }

View:

Registration page view

@model HindiMovie.Models.User

@{
ViewBag.Title = "Register";
}
<link href="~/Content/Site.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

<h2>Register</h2>

@using (Html.BeginForm()) {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)

<fieldset>
    <legend>User</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.UserName)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.UserName)
        @Html.ValidationMessageFor(model => model.UserName)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Password)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Password)
        @Html.ValidationMessageFor(model => model.Password)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.FirstName)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.FirstName)
        @Html.ValidationMessageFor(model => model.FirstName)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.LastName)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.LastName)
        @Html.ValidationMessageFor(model => model.LastName)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.PhoneNum)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.PhoneNum)
        @Html.ValidationMessageFor(model => model.PhoneNum)
    </div>

    <p>
        <input type="submit" value="Register" />
        <input type="reset" value="Clear" />
    </p>
</fieldset>
}

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

Login page View:

@model HindiMovie.Models.User
@{
ViewBag.Title = "Login";
}

<h2>Login</h2>

@using (Html.BeginForm()) {
@Html.AntiForgeryToken()


<fieldset>
    <legend>User</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.UserName)
    </div>
    <div class="editor-field">
        @Html.TextBoxFor(model => model.UserName)
        @Html.ValidationMessageFor(model => model.UserName)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Password)
    </div>
    <div class="editor-field">
        @Html.PasswordFor(model => model.Password)
        @Html.ValidationMessageFor(model => model.Password)
    </div>





    <p>
        <input type="submit" value="Sign in" />
    </p>
</fieldset>


}

@Html.ValidationMessage("LogOnError")

<div>
@Html.ActionLink("Create account", "Register","User")
</div>

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

Answer 1

You are using the same model for the Login and the Registration page, so you get the same validation on both pages.

Create a ViewModel for each view and put your validation attributes there. That way you can differentiate between the validations for each page.