How to check if user already exists on client-side in ASP.NET MVC 5?

Question

Using Visual Studio 2013.4 (Visual Studio 2013 Update 4) I have created a regular ASP.NET MVC 5 project with Individual User Accounts authentication configuration. All the users registration and log-in features has been already scaffolded for me by Visual Studio and works fine.

How to implement client-side validation of the following rule on the registration page: There is no already registered user with the same Email?

score 14 · Accepted Answer · answered Feb 13 '15 at 17:29

14

You could use RemoteAttribute to perform client side validation with a server callback.

1) Add the following method to the AccountController:

[AllowAnonymous]
public async Task<JsonResult> UserAlreadyExistsAsync(string email)
{
    var result = 
        await userManager.FindByNameAsync(email) ?? 
        await userManager.FindByEmailAsync(email);
    return Json(result == null, JsonRequestBehavior.AllowGet);
}

2) Add Remote attribute to Email property of RegisterViewModel class:

[Remote("UserAlreadyExistsAsync", "Account", ErrorMessage = "User with this Email already exists")]
public string Email { get; set; }

where "Account" is the name of the serving controller and "UserAlreadyExistsAsync" is it's action name.

answered Feb 13 '15 at 17:29

Deilan

4,740
3
39
52

3

Worth also reading [How to: Implement Remote Validation in ASP.NET MVC](https://msdn.microsoft.com/en-us/library/gg508808%28VS.98%29.aspx) – Feb 14 '15 at 05:35
This is exactly what I was looking for but it does not work with twitterbootstrapmvc library `@Html.Bootstrap().TextBoxFor(t => t.Email).Placeholder("Email Address").ShowValidationMessage(true)` *//how do I validate/invoke on the client side here with the twitterbootstrapmvc hellper lib* `@Html.ValidationMessageFor(t => t.Email)` – aggie Aug 31 '15 at 07:41
What should I do if I want to check for a username only on Save operation, not on update operation. – Hemal Jan 03 '17 at 11:22

score 0 · Answer 2 · answered Feb 29 '16 at 16:03

This helped alot. In my case it was a table, where updates were also possible. In this case the above solution doesn't work. So I wanted to share my solution for this case.

In the solution below, I added an additional field to pass to the Controller(The Primary Key of the Model). Then in the controller I am checking if the Primary Key is given. If so, we know, that we came from the update site since it's the only case where we already have an ID in the model. The last step is to check if the string and the primary key is the same. If they both are, it's ok, because we didn't change anything in the string. If only the string is the same but not the ID, it means, that we changed the string and changed it to another existing items string, so we return false.

Model:

    [Key]
    [Display(Name = "Idee ID")]
    public int intIdeaID { get; set; }

    [Required(ErrorMessage = "Dieses Feld muss ausgefüllt werden")]
    [Display(Name = "Idee")]
    [Remote("ideaExists", "TabIdea", HttpMethod = "POST", ErrorMessage = "Es wurde bereits eine Idee mit dieser Bezeichnung erstellt", AdditionalFields = "intIdeaID")]
    public string strIdea { get; set; }

Controller:

[HttpPost]
public JsonResult ideaExists(string strIdea, int? intIdeaID)
{
    if (intIdeaID != null)
    {
        if (db.tabIdea.Any(x => x.strIdea == strIdea))
        {
            tabIdea existingTabIdea = db.tabIdea.Single(x => x.strIdea == strIdea);
            if (existingTabIdea.intIdeaID != intIdeaID)
            {
                return Json(false);
            }
            else
            {
                return Json(true);
            }
        }
        else
        {
            return Json(true);
        }
    }
    else
    {
        return Json(!db.tabIdea.Any(x => x.strIdea == strIdea));
    }
}

How to check if user already exists on client-side in ASP.NET MVC 5?

2 Answers2

Linked