Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Lekce 6 - Zpracování dat a validace v ASP.NET MVC

V minulé lekci, Obsluha formulářů v ASP.NET MVC, jsme načali zpracování formulářů a napojení modelu na pohled.

Jednoduchou kalkulačku dnes v C# .NET tutoriálu dokončíme.

Odeslání formuláře

Při odeslání formuláře se nic nestane. Je to z toho důvodu, že formulář odešle data na tu samou stránku. Požadavek tedy zachytí metoda Index() v kontroleru, která vypadá následovně:

public ActionResult Index()
{
    Kalkulacka kalkulacka = new Kalkulacka();
    return View(kalkulacka);
}

I po odeslání formuláře se tedy vytvoří nová instance kalkulačky, která má nulový výsledek a ta se nastaví pohledu. Proto je výsledek stále nula. Situaci odeslání formuláře na stránku, která ho má zpracovat, se někdy říká PostBack. My bychom právě na tuto situaci potřebovali reagovat jiným způsobem, než když uživatel na stránku jen vstoupí aniž by něco odesílal.

Do kontroleru přidáme další metodu Index(), tentokrát s parametrem a atributem HttpPost:

[HttpPost]
public ActionResult Index(Kalkulacka kalkulacka)
{
    if (ModelState.IsValid)
    {
        kalkulacka.Vypocitej();
    }

    return View(kalkulacka);
}

V metodě nám přijde instance kalkulačky tak, jak byla vytvořena z hodnot v odeslaném formuláři. Pokud je model validní, což zjistíme pomocí třídy ModelState, zavoláme metodu pro výpočet. Nakonec vrátíme pohled, kterému předáme daný model se zadanými hodnotami a výsledkem.

Metoda je označená atributem [HttpPost]. Tím říkáme, že si přejeme, aby byla spuštěna pouze v případě, že se odeslal formulář. ASP.NET vždy spouští to přetížení metody, které se nejvíce hodí na danou situaci. Odeslání formuláře tedy již nespadne do první metody Index(), ale až do té nové.

Aplikaci můžeme vyzkoušet, již se nám bude zobrazovat výsledek operace:

Kalkulačka v ASP.NET MVC - Základy ASP.NET MVC

Vyplněná zůstanou i ostatní pole, jelikož se hodnota načítá z modelu, který ji má nastavenou z POST.

GET a POST

Slušelo by se říci, že kromě metody POST existuje ještě metoda GET. Obě metody můžeme použít k zaslání dat naší aplikaci.

Již víme, že metodou POST se odesílají hodnoty z formuláře. Data se odešlou uvnitř HTTP požadavku na server. Ačkoli se to nemusí vždy striktně dodržovat, metoda POST slouží hlavně pro vkládání nových dat.

Metodou GET předáváme data přímo v URL adrese. Pokud bychom ji chtěli u nějaké metody kontroleru vynutit, můžeme použít podobně jako u Post atribut [HttpGet].

Udělejme si jednoduchý příklad použití parametru předaného metodou GET. Kdybychom např. chtěli uvést v URL adrese věnování, pro koho je kalkulačka vytvořena, vypadala by URL adresa takto:

http://localhost:50913/Home/Index?jmeno=Karla

Váš port bude samozřejmě opět jiný. Abychom takovouto hodnotu načetli, přesuneme se do první metody Index(), které přidáme parametr. Ten vzápětí předáme pomocí ViewBag pohledu.

public ActionResult Index(string jmeno)
{
    Kalkulacka kalkulacka = new Kalkulacka();
    ViewBag.Jmeno = jmeno;
    return View(kalkulacka);
}

Parametr vypíšeme v pohledu v nadpisu H2:

@if (ViewBag.Jmeno != null) {
    <text> pro @ViewBag.Jmeno</text>
}

Pokud je parametr Jmeno zadaný (není null), vypíšeme do nadpisu ještě pro a obsah parametru. Pokud v konstrukci @if vypisujeme nějaký text, měl by být obalený v elementu <text>

Výsledek:

Kalkulačka v ASP.NET MVC - Základy ASP.NET MVC

Parametr bychom stejně dobře mohli místo pohledu předat modelu, v kalkulačce mě nenapadá žádné využití, v aplikaci pro generování náhodných čísel by parametr mohl udávat kolik čísel si přejeme vygenerovat.

Již tedy umíme předávat data skriptu na serveru a to buď v URL adrese pomocí metody GET nebo v těle HTTP požadavku pomocí metody POST. POST používají zejména formuláře, GET pokud chceme, aby se hodnota zadávala formou odkazu.

Labely

Popisky u polí formuláře obsahují text s názvem vlastnosti, ke které se váží. Názvy jako Cislo1 však nejsou pro uživatele příliš vábné. Proto k vlastnostem ve třídě Kalkulacka přidáme atributy s lidštějším popisem:

public class Kalkulacka
{
    [Display(Name = "1. číslo")]
    public double Cislo1 { get; set; }
    [Display(Name = "2. číslo")]
    public double Cislo2 { get; set; }
    public double Vysledek { get; set; }
    [Display(Name = "Operace")]
    public string Operace { get; set; }
    public List<SelectListItem> MozneOperace { get; set; }

    ...

K atributům je třeba přidat potřebné usingy.

Výsledek:

Kalkulačka v ASP.NET MVC - Základy ASP.NET MVC

Validace

Posledním tématem, které si na naší kalkulačce vyzkoušíme, bude validace. Určitě jste již zjistili, že pokud nezadáte správný formát, ASP.NET vám formulář nedovolí odeslat.

Validace v ASP.NET MVC - Základy ASP.NET MVC

Validace se generují automaticky podle datového typu dané vlastnosti modelu a jsou jak na straně klienta, tak na straně serveru.

Pokud zadáte neplatný vstup, zachytí ho ještě před odesláním na server validátor v JavaScriptu. Požadavek se tedy vůbec neodešle. Pro jistotu musí být ta samá validace i na serveru, protože klient si může např. JavaScript vypnout.

Ukažme si, jak zadat vlastní chybové hlášky k jednotlivým polím. Navštívíme opět model a k atributům nad vlastnostmi přidáme další:

public class Kalkulacka
{
    [Required(ErrorMessage = "Zadejte prosím číslo")]
    [Display(Name = "1. číslo")]
    public int Cislo1 { get; set; }
    [Required(ErrorMessage = "Zadejte prosím číslo")]
    [Display(Name = "2. číslo")]
    public int Cislo2 { get; set; }
    public int Vysledek { get; set; }
    [Display(Name = "Operace")]
    public string Operace { get; set; }
    public List<SelectListItem> MozneOperace { get; set; }

Atribut Required nám umožňuje určit, že je zadání pole nutné. Pokud ho uživatel nezadá, vypíše se daná chybová hláška. Atribut můžeme uvést i bez hlášky.

U čísel můžeme dále např. validovat jejich rozsah:

[Range(1, 100, ErrorMessage = "Zadejte prosím číslo od 1 do 100.")]

U řetězců např. jejich délku:

např. [StringLength(5)]

Nebo je validovat pomocí regulárních výrazů

[RegularExpression("\\d+", ErrorMessage = "Neplatný kód")]

Můžete si zkusit, že se hlášky opravdu vypíší.

Validace v ASP.NET MVC - Základy ASP.NET MVC

Model kalkulačky je nyní plný atributů a je tedy uzpůsobený hlavně pro View, proto se těmto modelům často říká ViewModel. Toto označení byste měli znát, pokud jste někdy pracovali s WPF.

To by bylo v naší kalkulačce již vše.

V příští lekci, Úprava template MVC v ASP.NET, začneme něco zajímavějšího. Půjde o osobní blog s administrací. Zdrojové kódy dnešního projektu máte ke stažení níže.


 

Měl jsi s čímkoli problém? Stáhni si vzorovou aplikaci níže a porovnej ji se svým projektem, chybu tak snadno najdeš.

Stáhnout

Stažením následujícího souboru souhlasíš s licenčními podmínkami

Staženo 586x (2.62 MB)
Aplikace je včetně zdrojových kódů v jazyce C#

 

Předchozí článek
Obsluha formulářů v ASP.NET MVC
Všechny články v sekci
Základy ASP.NET MVC
Přeskočit článek
(nedoporučujeme)
Úprava template MVC v ASP.NET
Článek pro vás napsal David Hartinger
Avatar
Uživatelské hodnocení:
33 hlasů
David je zakladatelem ITnetwork a programování se profesionálně věnuje 15 let. Má rád Nirvanu, nemovitosti a svobodu podnikání.
Unicorn university David se informační technologie naučil na Unicorn University - prestižní soukromé vysoké škole IT a ekonomie.
Aktivity