Výukový program webových formulářů ASP.NET: Příklady uživatelských ovládacích prvků

V ASP.Net je možné vytvořit znovu použitelný kód. Znovu použitelný kód lze použít na mnoha místech, aniž by bylo nutné kód znovu psát.

Opakovaně použitelný kód pomáhá zkrátit dobu, kterou vývojář stráví po napsání kódu. Lze jej napsat jednou a znovu použít na více místech.

Vytvořte User Control v ASP.Net

ASP.Net umožňuje vytvářet webové ovládací prvky. Tyto ovládací prvky obsahují kód, který lze znovu použít. Lze jej použít v celé aplikaci dle požadavků.

Podívejme se na příklad, jak můžeme v ASP.Net vytvořit webový uživatelský ovládací prvek.

V našem příkladu:

• Vytvoříme webový ovládací prvek.
• Bude použit k vytvoření komponenty záhlaví.
• Bude obsahovat níže uvedený text: „Guru„99 tutoriálů“ a „Tento tutoriál je pro ASP.Net“.

Pojďme pracovat s naší aktuální webovou aplikací vytvořenou v předchozích částech. Při vytváření webového uživatelského ovládacího prvku postupujte podle níže uvedených kroků.

Krok 1) Prvním krokem je vytvoření webového uživatelského ovládacího prvku a jeho přidání do našeho řešení Visual Studio.

1. Přejděte do Průzkumníka řešení v aplikaci Visual Studio a klikněte pravým tlačítkem myši na řešení DemoApplication.
2. Vyberte položku nabídky Přidat->Nová položka.

Krok 2) V dalším kroku musíme zvolit možnost vytvoření webového uživatelského ovládacího prvku.

1. V dialogovém okně projektu můžeme vidět různé možnosti vytváření různých typů komponent. Klikněte na možnost „Web“ na levé straně.
2. Po kliknutí na možnost „Web“ se zobrazí možnost „Ovládání webových formulářů uživatelem“. Klikněte na tuto možnost.
3. Poté zadáme název webovému ovládacímu prvku, „Guru99Control“.
4. Nakonec klikněte na tlačítko „Přidat“, aby Visual Studio přidalo do našeho řešení ovládání webového uživatele.

Pak uvidíte „GuruDo roztoku byl přidán „99Control“.

Krok 3) Nyní je čas přidat vlastní kód do webového uživatelského ovládacího prvku. Náš kód bude založen na čisté syntaxi HTML. Přidejte následující kód do sekce 'GuruSoubor 99Control.ascx.

<table>
	<tr>
	  <td>Guru99 Tutorials</td>
	</tr>

	<tr>
	  <td> This Tutorial is for</td>
	</tr>
</table>

Code Vysvětlení:-

1. V našem souboru Web Control nejprve vytvoříme prvek table. Ten bude sloužit k uložení 2 řádků textu, které zobrazí „Guru„99 tutoriálů“ a „Tento tutoriál je pro ASP.Net.“
2. Dále definujeme první řádek tabulky a vložíme text jako „Guru99 tutoriálů.“
3. Poté definujeme náš druhý řádek tabulky a vložíme text jako „Tento návod je pro ASP.Net“.

POZNÁMKA: Nyní nemůžeme tento kód spustit a zobrazit výstup. Jediný způsob, jak zjistit, zda to funguje, je zahrnout ho do naší aplikace (soubor aspx). Uvidíme to v následujícím tématu.

Registrace uživatelských ovládacích prvků ve webovém formuláři ASP.NET

V předchozí části jsme si ukázali, jak si můžeme vytvořit vlastní webový ovládací prvek. Ten lze použít k zobrazení následujících dvou řádků ve webovém formuláři:

• "Guru99 tutoriálů“
• "Tento návod je pro ASP.Net."

Jakmile je vlastní „ovládací prvek“ vytvořen, musíme jej použít v naší webové aplikaci. Prvním krokem je registrace komponenty v naší aplikaci (Demo.aspx). To je předpoklad pro použití jakéhokoli vlastního webového ovládacího prvku v aplikaci ASP.Net.

Podívejme se, jak toho můžeme dosáhnout. Níže uvedené kroky navazují na předchozí část, ve které jsme si vytvořili vlastní ovládací prvek. V této části použijeme ovládací prvek v našem Demo.aspx webový formulář. Nejprve zaregistrujeme náš vlastní „ovládací prvek“ do souboru Demo.aspx.

Krok 1) Ujistěte se, že pracujete se souborem demo.aspx. V tomto souboru bude registrován webový uživatelský ovládací prvek. To lze provést dvojitým kliknutím na soubor demo.aspx v Průzkumníku řešení vašeho .Net řešení.

Po dvojitém kliknutí na formulář se ve formuláři pravděpodobně zobrazí níže uvedený kód. Toto je výchozí kód, který Visual Studio přidává při přidání webového formuláře do projektu ASP.Net. Výchozí kód se skládá z kroků, které jsou nutné k zajištění toho, aby se formulář mohl v prohlížeči spustit jako webový formulář ASP.Net.

Krok 2) Nyní přidejme náš kód pro registraci uživatelského ovládacího prvku. Níže uvedený snímek obrazovky ukazuje registraci uživatelského ovládacího prvku přidaného k výše uvedenému základnímu kódu.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>
<%@ Register Src="~/Guru99Control.ascx" TagName="WebControl" TagPrefix="TWebControl" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
<body>
	<form id="form1" runat="server">
		<TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

Code Vysvětlení:-

1. Prvním krokem je registrace webového uživatelského ovládacího prvku. Ta zahrnuje následující základní parametry:
   1. Klíčové slovo 'Registrovat' se používá k registraci webového uživatelského ovládání.
   2. Parametr Src se používá k definování názvu ovládacího prvku, který je v našem případě Guru99Control.ascx.
   3. TagName a TagPrefix jsou individuální názvy přiřazené ovládacímu prvku. To se provádí proto, aby se na ně dalo odkazovat na HTML stránkách jako na normální HTML ovládací prvek.
2. Dále odkazujeme na náš webový uživatelský ovládací prvek pomocí dříve přiřazeného TagPrefix:TagName. TagPrefix:TagName je indikátor, že chceme použít náš vlastní webový ovládací prvek. Když webový server zpracuje stránku, uvidíte, že jsme použili tag TWebControl:WebControl. Poté zpracuje 'Guru99Control' odpovídajícím způsobem.
   1. Ovládacímu prvku „Header“ je přiřazeno volitelné ID. Obecně je dobrým zvykem přiřadit ID ovládacímu prvku HTML.
   2. Atribut runat=”server” nakonec zajišťuje, že ovládací prvek bude spuštěn na webovém serveru. Pro všechny ovládací prvky ASP.Net je to výchozí atribut. Všechny ovládací prvky ASP.Net (včetně vlastních ovládacích prvků) musí běžet na serveru. Jejich výstup je poté odeslán ze serveru klientovi a odpovídajícím způsobem zobrazen v prohlížeči.

Když je nastaven výše uvedený kód a projekt je spuštěn pomocí Visual Studio, získáte níže uvedený výstup.

Výstup:-

Výstupní zpráva zobrazená v prohlížeči ukazuje, že uživatelská kontrola webu byla úspěšně provedena.

Globální registrace ovládacích prvků ASP.Net v konfiguračním souboru web.config

Někdy může být žádoucí používat uživatelské ovládací prvky na více stránkách v aplikaci .Net. V tomto okamžiku nechcete neustále registrovat uživatelské ovládací prvky na každé stránce ASP.Net.

• V .Net můžete provést registraci v souboru 'web.config'.
• Soubor web.config je běžný konfigurační soubor používaný všemi webovými stránkami v projektu .Net.
• Obsahuje potřebné konfigurační detaily pro webový projekt ASP.Net. Například jedna běžná konfigurace v souboru web.config je parametr cílového rámce.
• Tento parametr se používá k identifikaci verze rozhraní .Net, kterou aplikace používá.

Níže je snímek výchozího kódu v souboru web.config. Zvýrazněná část je cílová rámcová část.

Podívejme se, jak můžeme zaregistrovat naše Guru99Control v souboru web.config.

Krok 1) Otevřete soubor web.config z Průzkumníka řešení dvojitým kliknutím na soubor.

Když otevřete soubor web.config, můžete vidět níže uvedenou konfiguraci. Soubor 'web.config' je automaticky přidán aplikací Visual Studio při vytvoření projektu. Toto je základní konfigurace požadovaná pro správné fungování projektu ASP.Net.

Krok 2) Nyní zaregistrujeme naši komponentu do souboru web.config. K tomu musíme přidat níže uvedené řádky.

<configuration>
	<system.web>
	 <compilation debug="true" targetFramework="4.5" />
	<pages>
		<controls>
		 <add tagPrefix="TWebControl" src="~/Guru99Control.ascx" tagName="WebControl" />
		</controls>
	</pages>
	</system.web>
</configuration>

Registrace zahrnuje následující dílčí kroky:

1. Přidejte značku s názvem . To znamená, že veškerá konfigurace ovládacích prvků bude použitelná pro všechny stránky ASP.Net v řešení.
2. The tag znamená, že přidáváte konfiguraci pro uživatelský ovládací prvek.
3. Poté zaregistrujeme uživatelský ovládací prvek s dalším tagem. Zbývající parametry tagPrefix, tagName a src zůstávají stejné jako dříve.

Krok 3) Nezapomeňte přejít na stránku 'demo.aspx' a odstranit řádky pro ovládací prvek, který měl registraci Guru99 komponent. Pokud tento krok neprovedete, pak 'GuruSoubor 99Control.ascx bude spuštěn ze souboru 'demo.aspx' namísto souboru 'web.config'.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head runat="server">
	  <title></title>
	</head>
<body>
	<form id="form1" runat="server">
	  <TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

Jakmile je výše uvedený kód nastaven a projekt je spuštěn pomocí Visual Studia, získáte níže uvedený výstup.

Výstup:-

Výstupní zpráva ukazuje, že uživatelská kontrola webu byla úspěšně provedena.

Přidání veřejných vlastností do webového ovládacího prvku

Vlastnost je pár klíč-hodnota přidružený k libovolnému ovládacímu prvku. Vezměme si příklad jednoduchého HTML tag. Níže je zobrazen snímek obrazovky, jak tag vypadá.

<html>
<body>
	<div style="color:#0000FF">

		Demo Form

	</div>
</body>
</html>

Značka 'div' se používá k vytvoření sekce v dokumentu HTML. Značka 'div' má vlastnost zvanou vlastnost style. To lze použít k tomu, aby se textu zobrazenému v tagu div dal jiný styl. Normálně byste viděli kód pro značku div, jak je uvedeno níže.

<div style="color:#0000FF">

Atribut barva tedy není nic jiného než pár klíč-hodnota, který poskytuje více informací o samotné značce. Ve výše uvedeném případě je název klíče 'style' a hodnota klíče je 'color:#0000FF'.

Podobně pro uživatelské ovládací prvky můžete vytvořit vlastní vlastnosti, které ovládací prvek popisují.

Vezměme si jednoduchý příklad a postavme na něm našeGuru99Control' vytvořený v předchozích částech. V našem příkladu přidáme jednoduchou celočíselnou vlastnost s názvem MinValue. Tato hodnota by představovala minimální počet znaků v textu zobrazeném v uživatelském ovládacím prvku.

Proveďme níže uvedené kroky, abychom to uvedli na místo.

Krok 1) Otevřete GuruSoubor 99Control.ascx. Přidejte kód pro přidání vlastnosti MinValue.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>

	<script runat="server">
	  public int MinValue = 0;
	</script>

<table>
	<tr>
	  <td>Guru99 Tutorials</td>
	</tr>

	<tr>
	  <td> This Tutorial is for</td>
	</tr>
</table>

Code Vysvětlení:-

Atribut skriptu runat="server" se používá k označení, že přidáváme kód specifický pro .Net a že je třeba jej spustit na webovém serveru. To je nutné pro zpracování jakékoli vlastnosti přidané do uživatelského ovládacího prvku. Poté přidáme naši vlastnost MinValue a nastavíme jí výchozí hodnotu 0.

Krok 2) Nyní se podívejme na tuto vlastnost v našem souboru demo.aspx. Vše, co nyní děláme, je pouze odkazování na vlastnost MinValue a přiřazení nové hodnoty 100.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head runat="server">
	  <title></title>
	</head>
<body>
	<form id="form1" runat="server">
	  <TWebControl:WebControl ID="Header" runat="server" MinValue="100" />
	</form>
</body>
</html>

POZNÁMKA: Po spuštění tohoto kódu se nezobrazí žádný výstup. Je to proto, že výstup je pod limitem 100 znaků.

Nejčastější dotazy