Ovládací prvky ASP.NET: ZkontrolujteBox, RadioButton, SeznamBox

Přidání ovládacích prvků ASP.Net do webových formulářů

ASP.Net umožňuje přidávat do formuláře ovládací prvky, jako jsou textová pole a popisky.

Podívejme se na další ovládací prvky dostupné pro webové formuláře a na některé jejich společné vlastnosti.

V našem příkladu vytvoříme jeden formulář, který bude mít následující funkce.

1. Možnost uživatele zadat své jméno.
2. Možnost vybrat si město, ve kterém uživatel bydlí.
3. Možnost uživatele zadat volbu pro pohlaví.
4. Možnost výběru kurzu, který se chce uživatel naučit. Na výběr bude obojí C# a ASP.Net.

Podívejme se podrobně na každý ovládací prvek. Přidejme je k sestavení formuláře s výše zmíněnou funkčností.

Krok 1) Prvním krokem je otevřít Návrhář formulářů pro webový formulář Demo. Jakmile to uděláte, budete moci přetahovat ovládací prvky z panelu nástrojů do Webový formulář.

Otevření webového formuláře v Návrháři:

• V Průzkumníku řešení klikněte pravým tlačítkem myši na soubor Demo.aspx a
• Zvolte možnost nabídky Zobrazit návrháře.

Jakmile provedete výše uvedený krok, budete moci vidět svého Návrháře formulářů, jak je znázorněno níže.

Nyní začněme přidávat ovládací prvky jeden po druhém.

Ovládání štítků

Ovládací prvek label se používá k zobrazení textu nebo zprávy uživateli ve formuláři. Ovládací prvek label se obvykle používá spolu s dalšími ovládacími prvky. Běžným příkladem je přidání labelu spolu s ovládacím prvkem textbox. Label uživateli sděluje, co se má v textovém poli vyplnit. Podívejme se, jak to můžeme implementovat na níže uvedeném příkladu. Použijeme label s názvem „name“ (jméno). Ten bude použit ve spojení s ovládacími prvky textbox, které budou přidány v pozdější části.

Krok 1) Prvním krokem je přetáhnout ovládací prvek „popisek“ z panelu nástrojů na webový formulář, jak je znázorněno níže.

Krok 2) Po přidání štítku postupujte podle následujících kroků.

1. Přejděte do okna vlastností kliknutím pravým tlačítkem myši na ovládací prvek popisek.
2. Vyberte možnost nabídky Vlastnosti.

Krok 3) V okně vlastností změňte hodnotu vlastnosti Text na Název.

Podobně také změňte hodnotu vlastnosti ID ovládacího prvku na lblName. Zadáním smysluplného ID k ovládacím prvkům je snazší k nim přistupovat během fáze kódování. To je zobrazeno níže.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Uvidíte, že se na webovém formuláři zobrazí popisek Name.

Textové pole

Textové pole se používá k tomu, aby uživatel mohl zadat nějaký text do webové formuláře aplikace. Podívejme se, jak to můžeme implementovat na příkladu uvedeném níže. Do formuláře přidáme jedno textové pole, do kterého může uživatel zadat své jméno.

Krok 1) Prvním krokem je přetažení ovládacího prvku textového pole z panelu nástrojů na webový formulář, jak je znázorněno níže.

Níže je uvedeno, jak by to vypadalo v návrháři formulářů po umístění ovládacího prvku Textbox na formulář.

Krok 2) Jakmile je textové pole přidáno, musíte změnit vlastnost ID.

• Přejděte do okna vlastností kliknutím pravým tlačítkem myši na ovládací prvek Textové pole a
• Zvolte Vlastnosti a poté
• Změňte vlastnost ID textového pole na txtName.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Seznam

Seznam se používá k zobrazení seznamu položek na webovém formuláři. Podívejme se, jak to můžeme implementovat na příkladu uvedeném níže. Do formuláře přidáme seznam pro uložení některých městských lokalit.

Krok 1) Prvním krokem je přetažení ovládacího prvku seznamu z panelu nástrojů na webový formulář, jak je znázorněno níže.

Krok 2) Po přetažení seznamu do formuláře se zobrazí samostatná boční nabídka. V této nabídce vyberte nabídku „Upravit položky“.

Krok 3) Nyní se vám zobrazí dialogové okno, ve kterém můžete přidat položky seznamu do seznamu.

1. Kliknutím na tlačítko Přidat přidáte položku seznamu.
2. Zadejte název textové hodnoty položky seznamu – v našem případě Bombaj. Opakujte kroky 1 a 2 pro přidání položek seznamu pro Mangalúr a Hajdarábád.
3. Klepněte na tlačítko OK.

Krok 4) Přejděte do okna vlastností a změňte hodnotu vlastnosti ID ovládacího prvku na lstLocation.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Z výstupu je jasně vidět, že seznam byl do formuláře přidán.

RadioButton

Přepínač se používá k zobrazení seznamu položek, ze kterých si uživatel může jednu vybrat. Podívejme se, jak to můžeme implementovat na příkladu uvedeném níže. Přidáme přepínač pro volbu muž/žena.

Krok 1) Prvním krokem je přetažení ovládacího prvku „radiobutton“ z panelu nástrojů na webový formulář (viz obrázek níže). Nezapomeňte přidat 2 přepínače, jeden pro možnost „Muž“ a druhý pro „Žena“.

Krok 2) Po přidání přepínacího tlačítka změňte vlastnost 'text'.

• Přejděte do okna vlastností kliknutím na 'Radiobutton control'.
• Změňte vlastnost textu přepínače na 'Muž'.
• Stejný krok opakujte pro změnu na „Žena“.
• Změňte také vlastnosti ID příslušných ovládacích prvků na rdMale a rdFemale.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Z výstupu je jasně vidět, že přepínač byl do formuláře přidán.

Checkbox

Zaškrtávací políčko slouží k zobrazení seznamu možností, ze kterých si uživatel může vybrat z více možností. Podívejme se, jak to můžeme implementovat na níže uvedeném příkladu. Do našich webových formulářů přidáme 2 zaškrtávací políčka. Tato zaškrtávací políčka poskytnou uživateli možnost zvolit, zda se chce učit. C# nebo ASP.Net.

Krok 1) Prvním krokem je přetažení ovládacího prvku zaškrtávacího políčka z panelu nástrojů na webový formulář, jak je znázorněno níže.

Krok 2) Jakmile jsou zaškrtávací políčka přidána, změňte vlastnost ID zaškrtávacího políčka.

• Přejděte do okna vlastností kliknutím na ovládací prvek Checkbox.
• Změňte vlastnosti ID příslušných ovládacích prvků na „chkC“ a „chkASP“.

Změňte také vlastnost text ovládacího prvku Checkbox na 'C#'. Udělejte totéž pro druhý ovládací prvek Checkbox a změňte jej na 'ASP.Net'.

1. Změňte vlastnost ID zaškrtávacího políčka na 'chkASP'.

2. Změňte vlastnost ID zaškrtávacího políčka na chkC.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Z výstupu je jasně vidět, že zaškrtávací políčka byla do formuláře přidána.

Tlačítko

Tlačítko slouží k tomu, aby uživatel klikl na tlačítko, které následně spustí zpracování formuláře. Podívejme se, jak to můžeme implementovat v našem aktuálním příkladu, jak je znázorněno níže. Přidáme jednoduché tlačítko s názvem „Odeslat“. To bude sloužit k odeslání všech informací ve formuláři.

Krok 1) Prvním krokem je přetažení ovládacího prvku tlačítka z panelu nástrojů na webový formulář, jak je znázorněno níže.

Krok 2) Po přidání tlačítka přejděte do okna vlastností kliknutím na ovládací prvek tlačítka. Změňte vlastnost text ovládacího prvku tlačítka na Odeslat. Také změňte vlastnost ID tlačítka na 'btnSubmit'.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Z výstupu je jasně vidět, že tlačítko bylo přidáno do formuláře.

Event Handler v ASP.Net

Při práci s webovým formulářem můžete do ovládacích prvků přidat události. Událost je něco, co se stane, když je provedena nějaká akce. Asi nejčastější akcí je kliknutí na tlačítko na formuláři.

Ve webových formulářích můžete přidat kód do odpovídajícího souboru aspx.cs. Tento kód lze použít k provedení určitých akcí při stisknutí tlačítka na formuláři. Toto je obecně nejběžnější událost ve webových formulářích. Pojďme se podívat, jak toho můžeme dosáhnout.

Uděláme to jednoduché. Stačí přidat událost do ovládacího tlačítka, aby se zobrazil název zadaný uživatelem. Abyste toho dosáhli, postupujte podle níže uvedených kroků.

Krok 1) Nejprve musíte dvakrát kliknout na tlačítko ve webovém formuláři. Tím se zobrazí kód události pro tlačítko v sadě Visual Studio.

Událost btnSubmit_Click je automaticky přidána sadou Visual Studio, když dvakrát kliknete na tlačítko v návrháři webových formulářů.

Krok 2) Nyní přidejte kód do události odeslání, aby se zobrazila hodnota textového pole názvu a umístění zvolené uživatelem.

protected void btnSubmit_Click(object sender, EventArgs e)
{
	Response.Write(txtName.Text + "<br/>");

	Response.Write(lstLocation.SelectedItem.Text + "<br/>");

	lblName.Visible = false;
	txtName.Visible = false;
	lstLocation.Visible = false;
	chkC.Visible = false;
	chkASP.Visible = false;
	rdFemale.Visible = false;
	btnSubmit.Visible = false;
}

Code Vysvětlení:-

1. Výše uvedený řádek kódu dělá tu nejjednodušší věc. Vezme hodnotu textového pole Name a odešle ji klientovi prostřednictvím objektu Response. Takže pokud chcete zadat řetězec „GuruPokud v textovém poli s názvem zadáte „99“, hodnota txtName.Text bude „Guru99 '.
2. Další řádek kódu vezme vybranou hodnotu seznamu pomocí vlastnosti 'lstLocation.SelectedItem.Text'. Tuto hodnotu pak zapíše zpět klientovi pomocí metody Response.Write.
3. Nakonec všechny ovládací prvky ve formuláři skryjeme. Pokud to neuděláme, zobrazí se všechny ovládací prvky a hodnoty odpovědí společně. Normálně, když někdo zadá do formuláře všechny informace, jako je jméno, místo, pohlaví atd., další stránka zobrazená uživateli by měla obsahovat pouze informace, které nebyly zadány. Uživatel nechce znovu vidět ovládací prvky Jméno, pohlaví a místo. ASP.Net to ale neví, a proto ve výchozím nastavení znovu zobrazí všechny ovládací prvky, když uživatel klikne na tlačítko Odeslat. Proto musíme napsat kód, který zajistí, že všechny ovládací prvky budou skryté, aby uživatel viděl pouze požadovaný výstup.

Jakmile provedete výše uvedené změny, uvidíte následující výstup.

Výstup:-

Na obrazovce Výstup proveďte následující kroky:

1. Uveďte jméno Guru99 do textového pole pro jméno.
2. Vyberte si místo v seznamu v Bengalúru.
3. Klikněte na tlačítko Odeslat.

Jakmile to uděláte, uvidíte 'Guru99' a na stránce zobrazené místo 'Bangalore'.

Nejčastější dotazy