In questo tutorial vedremo come aggiungere dei campi  personalizzati ad un’applicazione MVC utilizzando coma provider per l’autenticazione ASP.NET Identity.

Img_152711193317

Creazione Progetto

Prima di tutto creiamo con Visual Studio un nuovo progetto ASP.NET MVC e lo chiamiamo per esempio MvcCustomIdentity:

Img_152711185113

Come autenticazione mettiamo Individual User Accounts:

image

Configurazione Classe ApplicationUser

Una volta creato il progetto ricerchiamo la classe ApplicationUser all’interno del file IdentityModels.cs nella cartella Models.

Per default la classe sarà definita come segue:

public class ApplicationUser : IdentityUser
    {
        public async Task<ClaimsIdentity> GenerateUserIdentityAsync(UserManager<ApplicationUser> manager)
        {
            // Note the authenticationType must match the one defined in CookieAuthenticationOptions.AuthenticationType
            var userIdentity = await manager.CreateIdentityAsync(this, DefaultAuthenticationTypes.ApplicationCookie);
            // Add custom user claims here
            return userIdentity;
        }
    }

Ora possiamo procedere con la nostra personalizzazione della classe ApplicationUser.

Per esempio possiamo aggiungere i seguenti campi:

  • Nome
  • Cognome

Inoltre i campi dovranno essere obbligatori e dovranno avere una lunghezza massima di 100 caratteri.

Aggiungendo i nostri due nuovi campi la nostra classe sarà:

public class ApplicationUser : IdentityUser
    {
        public async Task<ClaimsIdentity> GenerateUserIdentityAsync(UserManager<ApplicationUser> manager)
        {
            // Note the authenticationType must match the one defined in CookieAuthenticationOptions.AuthenticationType
            var userIdentity = await manager.CreateIdentityAsync(this, DefaultAuthenticationTypes.ApplicationCookie);
            // Add custom user claims here
            return userIdentity;
        }

        [Required]          //Campo Obbligatorio
        [MaxLength(100)]    //Campo con lunghezza massima 100 caratteri
        public string Nome { get; set; }

        [Required]          //Campo Obbligatorio
        [MaxLength(100)]    //Campo con lunghezza massima 100 caratteri
        public string Cognome { get; set; }

    }

Nel caso in cui Visual Studio segnali in rosso gli attributi [Required] e [MaxLenght], basterà aggiungere la seguente using in testa al nostro file

using System.ComponentModel.DataAnnotations;

In alternativa possiamo farla aggiungere direttamente da Visual Studio passando con il mouse sopra gli attributi evidenziati in rosso e aprendo il menu presente sulla “lampadina”:

image

A questo punto basta selezionare la prima voce ed il problema risulterà risolto.

Modifica Modello di dati RegisterViewModel

Una volta modificata la classe ApplicationUser possiamo procedere con la modifica del Form di Registrazione.

La classe che andremo a modificare si chiama RegisterViewModel ed è presente nel file AccountViewModels.cs nella cartella Models del progetto.

Una volta trovata andiamo a personalizzarla e ad aggiungere i nostri nuovi campi:

public class RegisterViewModel
    {
        [Required]      //Campo Obbligatorio
        [Display(Name = "Username")]
        public string Username { get; set; }

        [Required]                  //Campo Obbligatorio
        [Display(Name = "Nome")]    //Label Da utilizzare per il Campo
        public string Nome { get; set; }

        [Required]                  //Campo Obbligatorio
        [Display(Name = "Cognome")] //Label Da utilizzare per il Campo
        public string Cognome { get; set; }


        [Required]                  //Campo Obbligatorio
        [EmailAddress]              //Campo di tipo Email
        [Display(Name = "Email")]   //Label Da utilizzare per il Campo
        public string Email { get; set; }
        
        [Required]                      //Campo Obbligatorio
        [StringLength(100, ErrorMessage = "La {0} deve essere lunga almeno {2} caratteri.", MinimumLength = 6)]
        [DataType(DataType.Password)]   //Campo di tipo password
        [Display(Name = "Password")]    //Label Da utilizzare per il Campo
        public string Password { get; set; }

        [DataType(DataType.Password)]           //Campo di tipo password
        [Display(Name = "Conferma Password")]   //Label Da utilizzare per il Campo
        [Compare("Password", ErrorMessage = "La password e quella di conferma non corripondono.")]
        public string ConfirmPassword { get; set; }
    }

Una volta terminata la definizione della ViewModel possiamo modificare la View che viene richiamata durante la registrazione di un Utente: Register.cshtml

Modifica View Registrazione

Una volta modificato il modello da utilizzare, possiamo procedere con la personalizzazione della View utilizzata per l’inserimento di un nuovo utente.

La View si chiama Register.cshtml ed è all’interno della cartella Views/Account/ ed il codice modificato sarà:

@model MvcCustomIdentity.Models.RegisterViewModel
@{
    ViewBag.Title = "Register";
}

<h2>@ViewBag.Title.</h2>

@using (Html.BeginForm("Register", "Account", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
    @Html.AntiForgeryToken()
    <h4>Create a new account.</h4>
    <hr />
    @Html.ValidationSummary("", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(m => m.Username, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Username, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.Nome, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Nome, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.Cognome, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Cognome, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Email, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.Password, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.PasswordFor(m => m.Password, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.ConfirmPassword, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.PasswordFor(m => m.ConfirmPassword, new { @class = "form-control" })
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" class="btn btn-default" value="Register" />
        </div>
    </div>
}

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

Rimanendo sulla View Register.cshtml, se eseguiamo l’applicazione attraverso la combinazione di tasti Ctrl + F5, vedremo subito il risultato della nostra modifica:

image

Ora possiamo procedere con l’ultima parte di codice che si occupa del salvataggio dei dati.

http://wiki.dotnetcode.it/post/Come-Aggiungere-dei-Campi-Personalizzati-in-ASPNET-Identity-Parte-2

Occhiolino

Autore:


blog comments powered by Disqus