Editing user profile details

user1900685 picture user1900685 · Apr 9, 2014 · Viewed 18.4k times · Source

How to create action and views for editing user custom informations?

Authorization is based on membership created by VS with MVC 4 project.

I've added additional columns, such as FirstName etc. I needed and registration works correctly, but I don't know how to get this attributes to show in view for @Html.EditorFor and to save changes in database (table UserProfile).

Many thanks for every tip.

Created model for edition:

public class UserProfileEdit
    {
        [Required]
        [Display(Name = "First name")]
        public string FirstName { get; set; }

        [Required]
        [Display(Name = "Last name")]
        public string LastName { get; set; }

        [Required]
        [Display(Name = "Email")]
        [DataType(DataType.EmailAddress)]
        public string Email { get; set; }
    }

Answer

Tomi Lammi picture Tomi Lammi · Apr 9, 2014

So you want an edit page for editing personal information of user. Additional columns are already added to UserProfile table.

First of all you need an actionmethod for edit view. Fetch the user from database and build your UserProfileEdit model.

public ActionResult Edit()
{
            string username = User.Identity.Name;

            // Fetch the userprofile
            UserProfile user = db.UserProfiles.FirstOrDefault(u => u.UserName.Equals(username));

            // Construct the viewmodel
            UserProfileEdit model = new UserProfileEdit();
            model.FirstName = user.FirstName;
            model.LastName = user.LastName;
            model.Email = user.Email;

            return View(model);
}

When we post the editform, we post UserProfileEdit model. We fetch the UserProfile from database again and change the posted fields.

    [HttpPost]
    public ActionResult Edit(UserProfileEdit userprofile)
    {
        if (ModelState.IsValid)
        {
            string username = User.Identity.Name;
            // Get the userprofile
            UserProfile user = db.UserProfiles.FirstOrDefault(u => u.UserName.Equals(username));

            // Update fields
            user.FirstName = userprofile.FirstName;
            user.LastName = userprofile.LastName;
            user.Email = userprofile.Email;

            db.Entry(user).State = EntityState.Modified;

            db.SaveChanges();

            return RedirectToAction("Index", "Home"); // or whatever
        }

        return View(userprofile);
    }

Now it's just coding in your view. Mine looks like this:

@model UserProfileEdit

@using (Html.BeginForm("Edit", "Account"))
{
    @Html.EditorFor(model => model.FirstName)
     @Html.EditorFor(model => model.LastName)
     @Html.EditorFor(model => model.Email)

    <input type="submit" value="Save" />
}

Automapper might help if you have tons of fields for your edit model. This solution edits the current logged in user but adding username as action parameter is rather trivial.