ASP.NET Web Forms oktatóanyag: Példák felhasználói vezérlőkre

Az ASP.Netben lehetőség van újrafelhasználható kód létrehozására. Az újrafelhasználható kód sok helyen használható anélkül, hogy újra meg kellene írnia a kódot.

Az újrafelhasználható kód segít csökkenteni a fejlesztő által a kód megírása után eltöltött időt. Egyszer elvégezhető, és több helyen újra felhasználható.

Felhasználói vezérlés létrehozása az ASP.Netben

Az ASP.Net képes webes vezérlők létrehozására. Ezek a vezérlők olyan kódot tartalmaznak, amely újra felhasználható. Az igényeknek megfelelően minden alkalmazáson keresztül használható.

Nézzünk egy példát arra, hogyan hozhatunk létre webes felhasználói vezérlőt az ASP.Netben

A mi példánkban

• Webes vezérlőt fogunk létrehozni.
• Ez egy fejléc komponens létrehozására szolgál.
• Az alább említett szöveget fogja tartalmazni.”Guru99 oktatóanyagok”Ez az oktatóanyag az ASP.Net számára készült”

Dolgozzunk a jelenlegi webalkalmazásunkkal, amelyet a korábbi részekben készítettünk. Kövesse az alábbi lépéseket webes felhasználói vezérlő létrehozásához.

Step 1) Az első lépés egy webes felhasználói vezérlő létrehozása, és hozzáadása a Visual Studio megoldásunkhoz.

1. Nyissa meg a Solution Explorer alkalmazást a Visual Studio alkalmazásban, és kattintson a jobb gombbal a DemoApplication Solution elemre
2. Válassza a Hozzáadás->Új elem menüpontot

Step 2) A következő lépésben ki kell választanunk a webes felhasználói vezérlő létrehozásának lehetőségét

1. A projekt párbeszédablakban különféle lehetőségeket láthatunk a különböző típusú komponensek létrehozására. Kattintson a „Web” lehetőségre a bal oldalon.
2. Amikor a „Web” lehetőségre kattintunk, megjelenik egy „Web Forms felhasználói vezérlés” opció. Kattintson erre a lehetőségre.
3. Ezután nevet adunk a webes vezérlőnek „Guru99Control”.
4. Végül kattintson a "Hozzáadás" gombra, hogy a Visual Studio hozzáadja a webes felhasználói vezérlést a megoldásunkhoz.

Látni fogja a „Guru99Control”-t a megoldáshoz.

Step 4) Itt az ideje, hogy hozzáadja az egyéni kódot a webes felhasználói vezérlőhöz. Kódunk tiszta HTML szintaxison fog alapulni. Adja hozzá a következő kódot a „Guru99Control.ascx” fájlhoz

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

Kód magyarázata: -

1. A Web Control fájlunkban először létrehozunk egy táblázatelemet. Ez 2 sornyi szöveg tárolására szolgál, amelyeket a megjelenítéshez használunk

• „Guru99 oktatóanyagok” és
• "Ez az oktatóanyag az ASP.Net számára készült."

2. Ezután meghatározzuk az első táblázatsorunkat, és a szöveget „Guru99 oktatóanyagok”-ként tesszük.
3. Ezután meghatározzuk a második táblázatsorunkat, és a szöveget így írjuk be: „Ez az oktatóanyag az ASP.Net számára készült”.

JEGYZET: Most nem tudjuk végrehajtani ezt a kódot és megjeleníteni a kimenetet. Az egyetlen módja annak, hogy megbizonyosodjon arról, hogy ez működik-e, ha belefoglalja az alkalmazásunkba (aspx fájl). Ezt a következő témában látni fogjuk.

Felhasználói vezérlők regisztrálása ASP.NET webes űrlapokon

Az előző részben láthattuk, hogyan hozhatunk létre egyéni webes vezérlőt. Ezzel a következő két sor megjeleníthető egy webes űrlapon

• „Guru99 oktatóanyagok”
• "Ez az oktatóanyag az ASP.Net számára készült."

Miután létrehoztuk az egyéni „vezérlőt”, használnunk kell azt a webalkalmazásunkban. Első lépésként regisztráljuk a komponenst az alkalmazásunkban (Demo.aspx). Ez az előfeltétele az ASP.Net alkalmazások bármely egyéni webvezérlőjének használatának.

Nézzük meg, hogyan érhetjük el ezt. Az alábbi lépések az előző szakasz folytatásai. Az előző részben létrehoztuk egyéni vezérlőnket. Ebben a részben a vezérlőt fogjuk használni Demo.aspx webes űrlap.

Először is regisztráljuk egyéni „vezérlőnket” a Demo.aspx fájlba.

Step 1) Győződjön meg arról, hogy a demo.aspx fájlon dolgozik. Ebben a fájlban lesz regisztrálva a webes felhasználói vezérlő. Ezt úgy teheti meg, hogy duplán kattint a demo.aspx fájlra a .Net megoldás Megoldáskezelőjében.

Miután duplán kattint az űrlapra, valószínűleg az alábbi kódot fogja látni az űrlapon. Ez a Visual Studio által hozzáadott alapértelmezett kód, amikor webes űrlapot adnak hozzá egy ASP.Net-projekthez.

Az alapértelmezett kód lépésekből áll, amelyek szükségesek ahhoz, hogy az űrlap ASP.Net webes űrlapként futhasson a böngészőben.

Step 2) Most adjuk hozzá a kódunkat a felhasználói vezérlő regisztrálásához. Az alábbi képernyőképen látható a felhasználói vezérlő regisztrálása a fenti alapkódhoz.

<%@ 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.ore/1999/xhtml">
	<head runat="server">
		<title></title>
	</head>
<body>
	<form id="forml" runat="server”>
		<TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

Kód magyarázata: -

1. Az első lépés a webes felhasználói vezérlő regisztrálása. Ez az alábbi alapvető paraméterekből áll
   1. A „Regisztráció” kulcsszó a webes felhasználói vezérlő regisztrálására szolgál.
   2. Az src paraméter a vezérlő nevének meghatározására szolgál, ami esetünkben Guru99Control.ascx.
   3. A címkenév és a Tagprefix a vezérlőnek adott egyedi nevek. Ez azért történik, hogy normál HTML-vezérlőként hivatkozhassanak a HTML-oldalakra.
2. Ezután hivatkozunk webfelhasználói vezérlésünkre a korábban hozzárendelt TagPrefix:TagName segítségével. A TagPrefix:TagName azt jelzi, hogy az egyéni webes vezérlőnket szeretnénk használni. Amikor az oldalt a webszerver feldolgozza, láthatja, hogy a TWebControl:WebControl címkét használtuk. Ezután ennek megfelelően feldolgozza a „Guru99Control”-t. Példánkban ez a TWebControl:WebControl.
   1. A „Fejléc” vezérléséhez opcionális azonosító tartozik. Általában jó gyakorlat azonosítót adni egy HTML-vezérlőnek.
   2. Végül a runat=server attribútum, hogy a vezérlő a webszerveren fusson. Az összes ASP.Net vezérlőnél ez az alapértelmezett attribútum. Minden ASP.Net vezérlőt (beleértve az egyéni vezérlőket is) a szerveren kell futtatni. Kimenetüket ezután a szerver elküldi a kliensnek, és ennek megfelelően megjelenik a böngészőben.

Amikor a fenti kód be van állítva, és a projekt a következővel fut Visual Studio. Az alábbi kimenetet kapod.

Kimenet:-

A böngészőben megjelenő kimeneti üzenet azt mutatja, hogy a webes felhasználói vezérlés sikeresen végrehajtva.

Az asp.net vezérlők globális regisztrálása az asp webes konfigurációs fájlban

Néha előfordulhat, hogy egy .Net-alkalmazás több oldalán kíván felhasználói vezérlőket használni. Ezen a ponton nem szeretné folytatni a felhasználói vezérlők regisztrálását minden egyes ASP.Net oldalon.

• A .Net-ben a regisztrációt a 'web.config' fájlban végezheti el.
• A web.config fájl egy általános konfigurációs fájl, amelyet a .Net projekt összes weboldala használ.
• Az ASP.Net webprojekthez szükséges konfigurációs részleteket tartalmazza. Például a web.config fájl egyik gyakori konfigurációja a célkeret-paraméter.
• Ez a paraméter az alkalmazás által használt .Net keretrendszer verziójának azonosítására szolgál.

Az alábbiakban a web.config fájl alapértelmezett kódjának pillanatképe látható. A kiemelt rész a célkeret rész.

Lássuk, hogyan regisztrálhatjuk Guru99Controlunkat a web.config fájlba.

Step 1) Nyissa meg a web.config fájlt a Megoldáskezelőben a fájlra duplán kattintva.

Amikor megnyitja a web.config fájlt, az alábbi konfigurációt láthatja. A „web.config” fájlt a Visual Studio automatikusan hozzáadja a projekt létrehozásakor. Ez az ASP.Net projekt megfelelő működéséhez szükséges alapvető konfiguráció.

Step 2) Most regisztráljuk az összetevőnket a web.config fájlba. Ehhez hozzá kell adnunk az alábbi sorokat.

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

A regisztráció az alábbi allépésekből áll

1. Adjon hozzá egy címkét . Ez azt jelenti, hogy a vezérlők összes konfigurációja alkalmazható lesz a megoldás összes ASP.Net oldalán.
2. A címke azt jelenti, hogy konfigurációt ad hozzá a felhasználói vezérlőhöz.
3. Ezután regisztráljuk a felhasználói vezérlőt a kiegészítő címkével. A tagPrefix, tagName és src többi paramétere ugyanaz marad, mint korábban.

Step 3) Ne felejtsd el menni a „demo.aspx” oldalra, és eltávolítani a vezérlő sorokat, amelyek a Guru99 komponens regisztrációját tartalmazták. Ha nem hajtja végre ezt a lépést, akkor a 'Guru99Control.ascx' egy fájl a 'demo.aspx' fájlból fut le a 'web.config' fájl helyett.

<%@ 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.ore/1999/xhtml">
	<head runat="server">
	  <title></title>
	</head>	
<body>
	<form id="form1" runat="server”>
	  <TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

A fenti kód be van állítva, és a projekt a Visual Studio segítségével fut. Az alábbi kimenetet kapod.

Kimenet:-

A kimeneti üzenet azt mutatja, hogy a webes felhasználói vezérlés sikeresen végrehajtva.

Nyilvános tulajdonságok hozzáadása egy webes vezérlőhöz

A tulajdonság bármely vezérlőhöz társított kulcs-érték pár. Vegyünk egy példát az egyszerűre HTML tag. Az alábbiakban egy képernyőkép látható a címke megjelenéséről.

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

A „div” címke egy szakasz létrehozására szolgál egy HTML-dokumentumban. A „div” címkének van egy stílustulajdonságnak nevezett tulajdonsága. Ezzel más stílust adhatunk a div címkében megjelenő szövegnek. Általában a div címke kódját látja az alábbiak szerint.

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

Tehát a color attribútum nem más, mint egy kulcs-érték pár, amely magáról a címkéről ad több információt. A fenti esetben a kulcs neve 'style', a kulcs értéke pedig 'color:#0000FF'.

Hasonlóképpen, a felhasználói vezérlők esetében létrehozhat saját tulajdonságokat, amelyek leírják a vezérlőt.

Vegyünk egy egyszerű példát, és építsünk a korábbi részekben létrehozott „Guru99Control”-unkra.

Példánkban egy MinValue nevű egyszerű egész tulajdonságot fogunk hozzáadni. Ez az érték a felhasználói vezérlőben megjelenő szöveg minimális karakterszámát jelenti.

Végezzük el az alábbi lépéseket, hogy ez a helyére kerüljön.

Step 1) Nyissa meg a Guru99Control.ascx fájlt. Adja hozzá a MinValue tulajdonság hozzáadásához szükséges kódot.

<%@ 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
	</tr>
</table>

Kód magyarázata: -

A runat=server parancsfájl attribútuma jelzi, hogy valamilyen.Net-specifikus kódot adunk hozzá, és azt a webszerveren kell futtatni.

Ez szükséges a felhasználói vezérlőhöz hozzáadott bármely tulajdonság feldolgozásához. Ezután hozzáadjuk a MinValue tulajdonságunkat, és alapértelmezett 0-t adunk neki.

Step 2) Most hivatkozzunk erre a tulajdonságra a demo.aspx fájlunkban. Most csak hivatkozunk a MinValue tulajdonságra, és hozzárendelünk egy új 100-as értéket.

!DOCTYPE html>
<html xmlns="http://www.w3.ore/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>

JEGYZET: – A kód futtatásakor nem jelenik meg semmilyen kimenet. Ennek az az oka, hogy a kimenet 100 karakteres korlát alá esik.

Összegzésként

• Az ASP.Net képes felhasználói vezérlők létrehozására. A felhasználói vezérlők olyan kódhoz használatosak, amelyet többször is használnak egy alkalmazásban. A felhasználói vezérlő ezután újra felhasználható az alkalmazásban.
• A felhasználói vezérlőt használat előtt regisztrálni kell az ASP.Net oldalon.
• Ha egy alkalmazás összes oldalán szeretné használni a felhasználói vezérlést, regisztrálja azt a web.config fájlba.
• Tulajdonságok is hozzáadhatók egy webes felhasználói vezérlőhöz.