W tym przykładzie zaprezentuję jak w najprostszy sposób stworzyć formularz, na podstawie klasy, która będzie znajdywała się w Modelu.
Zatem tworzymy klasę w modelu, nadając nazwy poszczególnym właściwościom. Spotkamy się tutaj również z Data Annotations, których działanie wytłumaczę je za pomocą komentarzy. Pamiętajmy, że aby dodać brakującą bibliotekę należy kliknąć na podkreśloną nazwę klasy i nacisnąć CTRL + . (kropka).
C#
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
namespace Form.Models { public class User { [ScaffoldColumn(false)] // ta właściwość nie zostanie wyświetlona w formularzu public int userID { get; set; } [Display(Name = "Imie:")] // nazwa jaką ma się pojawić, domyślnie w naszym przypadku byłoby to "Name" [Required(ErrorMessage = "Musisz wprowadzić imię")] // prosta walidacja - użytkownik będzie zmuszony do wpisania wartości w polu - wartość jest wymagana, uzupelniamy rowniez tekst bledu jaki ma sie pojawic w przypadku pozostawionego pustego pola [Display(Name = "Nazwisko:")] [Required(ErrorMessage = "Musisz wprowadzić nazwisko")] public string Surname { get; set; } [Display(Name = "Adres email:")] [Required(ErrorMessage = "Musisz wprowadzić adres e-mail")] [EmailAddress] public string EMail { get; set; } [Display(Name = "Hasło:")] [Required(ErrorMessage = "Musisz wprowadzić hasło")] [StringLength(18, ErrorMessage = "Hasło powinno zawierać przynajmniej 6, a maksymalnie 18 znaków", MinimumLength = 6)] [DataType(DataType.Password)] public string Password { get; set; } [Display(Name = "Powtórz hasło:")] [Required(ErrorMessage = "Musisz wprowadzić powtórzone hasło")] [DataType(DataType.Password)] public string ConfirmPassword { get; set; } [Display(Name = "Nazwa Firmy:")] [Required(ErrorMessage = "Musisz wprowadzić nazwę firmy")] public string FirmName { get; set; } [Required(ErrorMessage = "Musisz wprowadzić NIP")] public int NIP { get; set; } } } |
Widok prezentuje się następująco:
C#
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
@model Form.Models.User @* powyżej wskazujemy na klasę w modelu z której będziemy korzystać - tzw. widok silnie typowany*@ @{ ViewBag.Title = "Formularz rejestracyjny"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section Styles{ <link href="~/Content/FormStyle.css" rel="stylesheet" /> } <h2>@ViewBag.Title</h2> @using (Html.BeginForm("AddUser", "Home")) @*Korzystamy z helpera BeginForm - wkazujemy na akcję w kotrolerze do ktrorej bedziemy postować dane*@ { @Html.AntiForgeryToken() <br /> @Html.EditorForModel() @*Html Helpre odpwiedzialny za stworzenie formularza z widoku*@ <br /> <input class="btn btn-primary" type="submit" value="Wyślij" /> <br /> <div class="validation-form"> @Html.ValidationSummary() </div> } |
Główna akcja rozgrywa się w kontrolerze, który wygląda w następujący sposób:
Kontroler
C#
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
namespace Form.Controllers { public class HomeController : Controller { // GET: Home public ActionResult Index() { return View(); } [ValidateAntiForgeryToken] [HttpPost] //oczekujemy żądania typy post - do tej akcji nie dostaniemy się wpisując odpowiednio jej nazwę w adresie przegladarki public ActionResult AddUser(User user)//w argumetach funckji znajduje się odpowiednia klasa z modelu { // walidacja - odwolujemy sie do poszczegolnych wlasciwosci funckji if (user.NIP.ToString().Length!=9) ModelState.AddModelError("NIP", "NIP powienien zawierać 9 liczb"); // ustawiamy tekst bledu jaki ma sie pojawic jak i nazwe zmiennej ktrorej ma dotyczyc if (user.Password!=user.ConfirmPassword) ModelState.AddModelError("ConfirmPassword", "Hasła powinny być identyczne"); if (!ModelState.IsValid) // jezeli wystapil blad, zwracamy aktualna strone do ktorej przekazujemy obiekt klasy, dzieki temu, uzupelnione przez nas pola nie zostana skasowane - po zaistnialym bledzie return View("Index", user); else { // Kod zapisujący lub wysyłający pytanie do właściciela strony return RedirectToAction("UserAdded",user); // jeszeli wszystko jest ok zwracamy widok i przekazujemy do niego obiekt } } public ActionResult UserAdded(User user) // akcja do ktorej uzytkownik zostanie przekierowany po prawidlowym wypelnieniu formularza { return View(user); } } } |
Efekt końcowy prezentuje się następująco:
