Handledning för ASP.NET Web Forms: Exempel på användarkontroller

I ASP.Net är det möjligt att skapa återanvändbar kod. Den återanvändbara koden kan användas på många ställen utan att behöva skriva koden igen.

Den återanvändbara koden hjälper till att minska mängden tid som utvecklaren spenderar efter att ha skrivit koden. Det kan göras en gång och återanvändas på flera ställen.

Skapa användarkontroll i ASP.Net

ASP.Net har förmågan att skapa webbkontroller. Dessa kontroller innehåller kod som kan återanvändas. Den kan användas över hela applikationen enligt kraven.

Låt oss ta en titt på ett exempel på hur vi kan skapa en webbanvändarkontroll i ASP.Net

I vårt exempel,

• Vi ska skapa en webbkontroll.
• Den kommer att användas för att skapa en rubrikkomponent.
• Den kommer att innehålla nedanstående text."Guru99 Tutorials"Denna handledning är för ASP.Net"

Låt oss arbeta med vår nuvarande webbapplikation skapad i de tidigare avsnitten. Låt oss följa stegen nedan för att skapa en webbanvändarkontroll.

Steg 1) Det första steget är att skapa en webbanvändarkontroll och lägga till den i vår Visual Studio-lösning.

1. Gå till Solution Explorer i Visual Studio och högerklicka på DemoApplication Solution
2. Välj menyalternativet Lägg till->Nytt objekt

Steg 2) I nästa steg måste vi välja alternativet att skapa en webbanvändarkontroll

1. I projektdialogrutan kan vi se olika alternativ för att skapa olika typer av komponenter. Klicka på alternativet "Webb" på vänster sida.
2. När vi klickar på alternativet "Webb" ser du ett alternativ för "Web Forms User control." Klicka på det här alternativet.
3. Vi ger sedan ett namn för webbkontrollen "Guru99Control".
4. Klicka slutligen på knappen "Lägg till" för att låta Visual Studio lägga till webbanvändarkontrollen till vår lösning.

Du kommer att se "Guru99Control" läggs till lösningen.

Steg 4) Nu är det dags att lägga till den anpassade koden i webbanvändarkontrollen. Vår kod kommer att baseras på ren HTML-syntax. Lägg till följande kod i filen 'Guru99Control.ascx'

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

Kodförklaring:-

1. I vår webbkontrollfil skapar vi först ett tabellelement. Detta kommer att användas för att hålla 2 rader med text som kommer att användas för att visa

• "Guru99 Tutorials" och
• "Denna handledning är för ASP.Net."

2. Därefter definierar vi vår första tabellrad och lägger texten som "Guru99 Tutorials."
3. Vi definierar sedan vår andra tabellrad och lägger texten som "Denna handledning är för ASP.Net."

ANMÄRKNINGAR: Nu kan vi inte exekvera den här koden och visa utdata. Det enda sättet att se om detta fungerar är att inkludera det i vår ansökan (aspx-fil). Vi kommer att se detta i det följande ämnet.

Registrera användarkontroller på ett ASP.NET-webbformulär

I det tidigare avsnittet såg vi hur vi kan skapa en anpassad webbkontroll. Detta kan användas för att visa följande två rader i ett webbformulär

• "Guru99 Tutorials"
• "Denna handledning är för ASP.Net."

När den anpassade "kontrollen" har skapats måste vi använda den i vår webbapplikation. Det första steget är att registrera komponenten i vår applikation (Demo.aspx). Detta är en förutsättning för att använda i alla anpassade webbkontroller i en ASP.Net-applikation.

Låt oss titta på hur vi kan uppnå detta. Stegen nedan är en fortsättning på föregående avsnitt. I föregående avsnitt har vi skapat vår anpassade kontroll. I det här avsnittet kommer vi att använda kontrollen i vår Demo.aspx webbformulär.

Först kommer vi att registrera vår anpassade "kontroll" i filen Demo.aspx.

Steg 1) Se till att du arbetar med filen demo.aspx. Det är i denna fil som webbanvändarkontrollen kommer att registreras. Detta kan göras genom att dubbelklicka på filen demo.aspx i lösningsutforskaren för din .Net-lösning.

När du dubbelklickar på formuläret kommer du förmodligen att se nedanstående kod i formuläret. Detta är standardkoden som läggs till av Visual Studio när ett webbformulär läggs till i ett ASP.Net-projekt.

Standardkoden består av steg, som krävs för att säkerställa att formuläret kan köras som ett ASP.Net-webbformulär i webbläsaren.

Steg 2) Låt oss nu lägga till vår kod för att registrera användarkontrollen. Skärmbilden nedan visar registrering av användarkontrollen till ovanstående grundkod.

<%@ 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>

Kodförklaring:-

1. Det första steget är att registrera webbanvändarkontrollen. Detta består av nedanstående grundparametrar
   1. Nyckelordet 'Registrera' används för att registrera webbanvändarkontrollen.
   2. Parametern src används för att definiera namnet på kontrollen, som i vårt fall är Guru99Control.ascx.
   3. Tagnamnet och Tagprefixet är individuella namn som ges till kontrollen. Detta görs så att de kan referera till HTML-sidor som en vanlig HTML-kontroll.
2. Därefter refererar vi till vår webbanvändarkontroll via TagPrefix:TagName som tilldelades tidigare. TagPrefix:TagName är en indikator på att vi vill använda vår anpassade webbkontroll. När sidan bearbetas av webbservern kan du se att vi har använt taggen TWebControl:WebControl. Den kommer sedan att bearbeta 'Guru99Control' i enlighet med detta. I vårt exempel är det TWebControl:WebControl.
   1. Ett valfritt ID ges till kontrollen av "Header". Det är i allmänhet en bra praxis att ge ett ID till en HTML-kontroll.
   2. Slutligen attributet runat=server så att kontrollen körs på webbservern. För alla ASP.Net-kontroller är detta standardattributet. Alla ASP.Net-kontroller (inklusive anpassade kontroller) måste köras på servern. Deras utdata skickas sedan från servern till klienten och visas därefter i webbläsaren.

När ovanstående kod är inställd och projektet exekveras med Visual Studio. Du kommer att få utdata nedan.

Produktion:-

Utdatameddelandet som visas i webbläsaren visar att webbanvändarkontrollen har utförts.

Registrering av asp.net kontroller globalt i webbkonfigurationsfilen asp

Ibland kanske man vill använda användarkontroller på flera sidor i en .Net-applikation. Vid det här laget vill du inte fortsätta att registrera användarkontroller på varje ASP.Net-sida.

• I .Net kan du utföra registreringen i filen 'web.config'.
• Web.config-filen är en vanlig konfigurationsfil som används av alla webbsidor i .Net-projektet.
• Den innehåller nödvändiga konfigurationsdetaljer för webbprojektet ASP.Net. Till exempel är en vanlig konfiguration i web.config-filen målramparameter.
• Denna parameter används för att identifiera .Net framework-versionen som används av applikationen.

Nedan är en ögonblicksbild av standardkoden i web.config-filen. Den markerade delen är målramdelen.

Låt oss se hur vi kan registrera vår Guru99Control i filen web.config.

Steg 1) Öppna filen web.config från lösningsutforskaren genom att dubbelklicka på filen.

När du öppnar filen web.config kan du se konfigurationen nedan. "web.config" läggs till automatiskt av Visual Studio när projektet skapas. Detta är den grundläggande konfigurationen som krävs för att få ASP.Net-projektet att fungera korrekt.

Steg 2) Låt oss nu registrera vår komponent i filen web.config. Vi måste lägga till raderna nedan för det.

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

Registreringen består av nedanstående delsteg

1. Lägg till en tagg som heter . Det betyder att all konfiguration för kontrollerna kommer att gälla för alla ASP.Net-sidor i lösningen.
2. De tag betyder att du lägger till en konfiguration för användarkontrollen.
3. Sedan registrerar vi användarkontrollen med tilläggstaggen. De återstående parametrarna för tagPrefix, tagName och src förblir desamma som tidigare.

Steg 3) Kom ihåg att gå till 'demo.aspx'-sidan och ta bort raderna för kontroll, som hade registreringen av Guru99-komponenten. Om du inte utför detta steg kommer filen 'Guru99Control.ascx' att köras från filen 'demo.aspx' istället för filen 'web.config'.

<%@ 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>

Ovanstående kod är inställd och projektet körs med Visual Studio. Du kommer att få utdata nedan.

Produktion:-

Utmatningsmeddelandet visar att webbanvändarkontrollen har utförts.

Lägga till offentliga egenskaper till en webbkontroll

En egenskap är ett nyckel-värdepar som är kopplat till en kontroll. Låt oss ta ett exempel på det enkla HTML-tagg. En skärmdump av hur taggen ser ut visas nedan.

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

Taggen 'div' används för att skapa ett avsnitt i ett HTML-dokument. Taggen 'div' har en egenskap som kallas stilegenskap. Detta kan användas för att ge en annan stil till texten som visas i div-taggen. Normalt ser du koden för div-taggen som visas nedan.

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

Så färgattributet är inget annat än ett nyckel-värdepar som ger mer information om själva taggen. I ovanstående fall är nyckelnamnet 'stil' och nyckelvärdet är 'färg:#0000FF'.

På samma sätt, för användarkontroller, kan du skapa dina egna egenskaper som beskriver kontrollen.

Låt oss ta ett enkelt exempel och bygga vidare på vår "Guru99Control" skapad i de tidigare avsnitten.

I vårt exempel kommer vi att lägga till en enkel heltalsegenskap som heter MinValue. Detta värde skulle representera det minsta antalet tecken i texten som visas i användarkontrollen.

Låt oss utföra de nedan nämnda stegen för att få detta på plats.

Steg 1) Öppna filen Guru99Control.ascx. Lägg till koden för att lägga till egenskapen 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
	</tr>
</table>

Kodförklaring:-

Skriptet runat=server-attributet används för att indikera att vi lägger till some.Net-specifik kod och att den måste köras på webbservern.

Detta krävs för att bearbeta alla egenskaper som läggs till i användarkontrollen. Vi lägger sedan till vår egenskap MinValue och ger den ett standardvärde på 0.

Steg 2) Låt oss nu referera till den här egenskapen i vår demo.aspx-fil. Allt vi gör nu är att bara referera till MinValue-egenskapen och tilldela ett nytt värde på 100.

!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>

ANMÄRKNINGAR: – När du kör den här koden kommer den inte att visa någon utdata. Detta beror på att utdata faller under 100 tecken.

Sammanfattning

• ASP.Net har förmågan att skapa användarkontroller. Användarkontroller används för att ha kod som används flera gånger i en applikation. Användarkontrollen kan sedan återanvändas i hela applikationen.
• Användarkontrollen måste registreras på ASP.Net-sidan innan den kan användas.
• För att använda användarkontroll över alla sidor i ett program, registrera det i web.config-filen.
• Egenskaper kan också läggas till i en webbanvändarkontroll.