Jak na vícestránkové formuláře v ASP.NET 3.5

V dnešním článku se podíváme na jednoduché vytvoření vícestránkového formuláře v ASP.NET pomocí Visual Studia 2008.

Určitě jste se již někdy dostali do situace kdy bylo potřeba vytvořit vícestránkový formulář, například objednávkový systém. Vše budu opět demonstrovat na stránkách webhostingu Stronghost.cz, konkrétně na objednávkovém systému.

Objednávka je rozdělena pro přehlednost do několika kroků:

  1. Ověření doménového jména
  2. Volba tarifu
  3. Fakturační údaje, způsob platby
  4. Rekapitulace, platba

Pro ilustraci přávám obrázek prvního kroku objednávky:

image

Pojďme si nyní společně vytvořit podobný objednávkový systém v ASP.NET. Zadání úkolu je vytvoření objednávkového systému pro stránky webhostingu. Jelikož se jedná o demonstraci tvorby vícestránkových formulářů, neuvažujeme o validaci dat a ukládání dat do databáze.

Je čas na akci!

  1. Nejprve musíme spustit Visual Studio 2008 a vytvořit novou Web Site pod názvem objednávka. Tento krok provedeme následovně: V menu File zvolíme položku New a vybereme Web Site…
    image
  2. Vybereme ASP.NET Web Site, položku Location ponecháme, v roletce Language vybereme svůj oblíbený jazyk, já ponechám Visual C#. Verzi .NET Frameworku měnit nebudeme. V cestě uložiště akorát přepíšeme WebSite1 na objednávka. Potvrdíme Ok a otevře se nám stránka Default.aspx.
    image
  3. K vytvoření vícestránkového formuláře využijeme ovládací prvek Wizard, který nalezneme v záložce Toolbox.Nyní se přepneme na záložku Design, a umístíme prvek Wizard do prostoru div.
    image
  4. V dalším kroku rozšíříme formulář o další dva kroky a upravíme názvy kroků. Tuto úpravu provedeme následovně:
    1. Vybereme ovládací prvek
    2. klikneme na šipku v pravém horním rohu a kontextové nabídky vybereme Add/Remove WizardSteps
      image
    3. Nyní pomocí tlačítka Add přidáme další dva kroky.
      image
    4. Názvy jednotlivých kroku změníme úpravou vlastnosti Title u každého kroku. Pro dokončení opět potrvdíme Ok.
      image
  5. Nyní máme vícestránkový formulář připraven. Nyní se vrhneme do umístění formulářových prvků. Formulářové prvky budeme umisťovat do moře orámovaného obdelníku, který se nacházi nyní nad tlačítkem Next. V prvním kroku vytvoříme formulář pro ověření domény.
    image
  6. Další kroky vytvoříme podobným způsobem. Jediné co budeme muset udělat je se vždy přepnout na daný krok kliknutím na název kroku v okně editoru.
    image
  7. Tak a to je vše přátelé, výslednou webovou stránku si můžete prohlédnout stisknutím ctrl+f5.
    image

    Závěr

    Krásou na ASP.NET je elegance a rychlost, se kterou se dělají weby pomocí této mocné technologie. Vzpomínám si jak dlouho jsem psal podobný objednávkový systém v PHP.

O Petr Láslo

Student ČVUT FJFI katedry softwarového inženýrství v ekonomii. Mezi jeho zájmy patří programování a sport. Autor má zkušenosti s PHP 5, MySQL, XHTML a CSS. Zajímá se o platformu .NET, jazyk C#, ASP.NET a WPF.