ASP.NET-webformulieren-zelfstudie: voorbeelden van gebruikersbedieningen

In ASP.Net is het mogelijk om herbruikbare code te creëren. De herbruikbare code kan op veel plaatsen worden gebruikt zonder dat u de code opnieuw hoeft te schrijven.

Herbruikbare code helpt ontwikkelaars tijd te besparen na het schrijven van de code. Het hoeft maar één keer geschreven te worden en kan vervolgens op meerdere plaatsen hergebruikt worden.

Creëer gebruikersbeheer in ASP.Net

ASP.Net biedt de mogelijkheid om webbesturingselementen te creëren. Deze besturingselementen bevatten code die hergebruikt kan worden. Ze kunnen naar behoefte in de hele applicatie worden ingezet.

Laten we eens kijken naar een voorbeeld van hoe we een webgebruikersbesturingselement in ASP.Net kunnen maken.

In ons voorbeeld:

• We gaan een webcontrole maken.
• Het zal worden gebruikt om een ​​headercomponent te maken.
• Het zal de volgende tekst bevatten: “Guru"99 handleidingen" en "Deze handleiding is voor ASP.Net".

Laten we werken met onze huidige webapplicatie die in de eerdere secties is gemaakt. Laten we de onderstaande stappen volgen om een ​​webgebruikersbeheer te maken.

Stap 1) De eerste stap is het maken van een webgebruikersbesturingselement en het toevoegen ervan aan onze Visual Studio-oplossing.

1. Ga naar de Solution Explorer in Visual Studio en klik met de rechtermuisknop op de DemoApplication-oplossing.
2. Kies het menu-item Toevoegen->Nieuw item.

Stap 2) In de volgende stap moeten we de optie kiezen om een ​​webgebruikersbesturingselement te maken.

1. In het projectdialoogvenster kunnen we verschillende opties zien voor het maken van verschillende typen componenten. Klik op de optie "Web" aan de linkerkant.
2. Als we op de optie 'Web' klikken, verschijnt de optie 'Webformulieren gebruikersbesturingselement'. Klik op deze optie.
3. Vervolgens geven we de webbesturing een naam, "Guru99Control”.
4. Klik ten slotte op de knop 'Toevoegen' zodat Visual Studio het besturingselement voor webgebruikers aan onze oplossing kan toevoegen.

Je ziet dan de “Guru"99Control" is aan de oplossing toegevoegd.

Stap 3) Nu is het tijd om de aangepaste code toe te voegen aan de webgebruikerscomponent. Onze code zal gebaseerd zijn op pure HTML-syntaxis. Voeg de volgende code toe aan de 'Guru99Control.ascx-bestand.

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

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

Code Uitleg:-

1. In ons webbesturingselement maken we eerst een tabelelement aan. Dit element zal twee regels tekst bevatten met de volgende tekst: “Guru"99 handleidingen" en "Deze handleiding is voor ASP.Net."
2. Vervolgens definiëren we onze eerste tabelrij en plaatsen we de tekst als “Guru99 handleidingen.”
3. Vervolgens definiëren we onze tweede tabelrij en plaatsen we de tekst als "Deze tutorial is voor ASP.Net."

NOTITIE: We kunnen deze code nu niet uitvoeren en de output weergeven. De enige manier om te zien of dit werkt, is door het in onze applicatie (aspx-bestand) op te nemen. We zullen dit in het volgende onderwerp bekijken.

Gebruikersbesturingselementen registreren op een ASP.NET-webformulier

In het vorige gedeelte hebben we gezien hoe we een aangepast webbesturingselement kunnen maken. Dit kan worden gebruikt om de volgende twee regels in een webformulier weer te geven:

• "Guru99 handleidingen
• “Deze tutorial is voor ASP.Net.”

Zodra de aangepaste 'control' is gemaakt, moeten we deze in onze webapplicatie gebruiken. De eerste stap is het registreren van de component in onze applicatie (Demo.aspx). Dit is een vereiste om een ​​aangepaste webcontrol in een ASP.Net-applicatie te kunnen gebruiken.

Laten we eens kijken hoe we dit kunnen bereiken. De onderstaande stappen zijn een vervolg op het vorige gedeelte, waarin we onze aangepaste besturingselement hebben gemaakt. In dit gedeelte zullen we het besturingselement gebruiken in onze Demo.aspx webformulier. Eerst registreren we onze aangepaste 'control' in het bestand Demo.aspx.

Stap 1) Zorg ervoor dat u aan het bestand demo.aspx werkt. In dit bestand wordt de webgebruikerscomponent geregistreerd. Dit kunt u doen door te dubbelklikken op het bestand demo.aspx in de Solution Explorer van uw .NET-oplossing.

Als u dubbelklikt op het formulier, ziet u waarschijnlijk de onderstaande code in het formulier. Dit is de standaardcode die Visual Studio toevoegt wanneer een webformulier aan een ASP.NET-project wordt toegevoegd. De standaardcode bestaat uit stappen die nodig zijn om ervoor te zorgen dat het formulier als een ASP.NET-webformulier in de browser kan worden uitgevoerd.

Stap 2) Laten we nu onze code toevoegen om de gebruikersbesturing te registreren. De onderstaande schermafbeelding laat zien hoe de registratie van de gebruikersbesturing, toegevoegd aan de bovenstaande basiscode, is voltooid.

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

1. De eerste stap is het registreren van de webgebruikersinterface. Dit omvat de volgende basisparameters:
   1. Het trefwoord 'Registreren' wordt gebruikt om de webgebruikersbediening te registreren.
   2. De parameter Src wordt gebruikt om de naam van het besturingselement te definiëren, wat in ons geval is Guru99Control.ascx.
   3. De TagName en TagPrefix zijn individuele namen die aan het besturingselement worden toegekend. Dit is gedaan zodat ernaar kan worden verwezen in HTML-pagina's als een normaal HTML-besturingselement.
2. Vervolgens verwijzen we naar onze webgebruikersbesturing via de eerder toegewezen TagPrefix:TagName. De TagPrefix:TagName geeft aan dat we onze aangepaste webbesturing willen gebruiken. Wanneer de pagina door de webserver wordt verwerkt, ziet u dat we de tag TWebControl:WebControl hebben gebruikt. De server zal dan de pagina verwerken.Guru99Control' dienovereenkomstig.
   1. Aan het besturingselement "Header" wordt optioneel een ID toegekend. Het is over het algemeen goede gewoonte om een ​​ID toe te kennen aan een HTML-besturingselement.
   2. Tot slot zorgt het attribuut runat=”server” ervoor dat het besturingselement op de webserver wordt uitgevoerd. Voor alle ASP.Net-besturingselementen is dit het standaardattribuut. Alle ASP.Net-besturingselementen (inclusief aangepaste besturingselementen) moeten op de server worden uitgevoerd. Hun uitvoer wordt vervolgens van de server naar de client verzonden en dienovereenkomstig in de browser weergegeven.

Wanneer de bovenstaande code is ingesteld en het project wordt uitgevoerd met behulp van Visual Studio, krijgt u de onderstaande uitvoer.

Uitgang: -

Het uitvoerbericht dat in de browser wordt weergegeven, geeft aan dat de webgebruikersbesturing succesvol is uitgevoerd.

ASP.Net-besturingselementen globaal registreren in het web.config-configuratiebestand

Soms wil je gebruikersbesturingselementen op meerdere pagina's in een .NET-applicatie gebruiken. In dat geval wil je niet op elke ASP.NET-pagina afzonderlijk gebruikersbesturingselementen registreren.

• In .Net kunt u de registratie uitvoeren in het bestand 'web.config'.
• Het web.config-bestand is een algemeen configuratiebestand dat door alle webpagina's in een .NET-project wordt gebruikt.
• Het bevat de benodigde configuratiedetails voor het ASP.Net-webproject. Een veelvoorkomende configuratie in het bestand web.config is bijvoorbeeld de doelraamwerkparameter.
• Deze parameter wordt gebruikt om de .Net-frameworkversie te identificeren die door de toepassing wordt gebruikt.

Hieronder ziet u een momentopname van de standaardcode in het web.config-bestand. Het gemarkeerde gedeelte is het doelframeworkgedeelte.

Laten we eens kijken hoe we ons kunnen registreren. Guru99Control in het web.config-bestand.

Stap 1) Open het web.config-bestand vanuit Solution Explorer door erop te dubbelklikken.

Wanneer u het web.config-bestand opent, ziet u mogelijk de onderstaande configuratie. De 'web.config' wordt automatisch toegevoegd door Visual Studio wanneer het project wordt gemaakt. Dit is de basisconfiguratie die nodig is om het ASP.Net-project goed te laten werken.

Stap 2) Laten we nu onze component registreren in het web.config-bestand. Daarvoor moeten we de onderstaande regels toevoegen.

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

De registratie bestaat uit de volgende sub-stappen:

1. Voeg een tag toe met de naam . Het betekent dat alle configuratie voor de bedieningselementen van toepassing is op alle ASP.Net-pagina's in de oplossing.
2. De tag betekent dat u een configuratie voor het gebruikersbeheer toevoegt.
3. Vervolgens registreren we de gebruikerscomponent met de extra tag. De overige parameters tagPrefix, tagName en src blijven hetzelfde als voorheen.

Stap 3) Vergeet niet naar de pagina 'demo.aspx' te gaan en de regels te verwijderen voor het besturingselement dat de registratie bevatte. Guru99 component. Als u deze stap niet uitvoert, dan de 'GuruHet bestand '99Control.ascx' wordt uitgevoerd vanuit het bestand 'demo.aspx' in plaats van vanuit het bestand '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>

Zodra de bovenstaande code is ingesteld en het project wordt uitgevoerd met Visual Studio, krijgt u de onderstaande uitvoer.

Uitgang: -

Het uitvoerbericht geeft aan dat de webgebruikerscontrole succesvol is uitgevoerd.

Openbare eigenschappen toevoegen aan een webbesturingselement

Een eigenschap is een sleutel-waardepaar dat is gekoppeld aan een besturingselement. Laten we een eenvoudig voorbeeld nemen. HTML-tag. Hieronder ziet u een schermafbeelding van hoe de tag eruitziet.

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

		Demo Form

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

De 'div'-tag wordt gebruikt om een ​​sectie in een HTML-document te maken. De 'div'-tag heeft een eigenschap die een stijleigenschap wordt genoemd. Dit kan worden gebruikt om een ​​andere stijl te geven aan de tekst die wordt weergegeven in de div-tag. Normaal gesproken ziet u de code voor de div-tag zoals hieronder weergegeven.

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

Het kleurattribuut is dus niets anders dan een sleutel-waardepaar dat meer informatie geeft over de tag zelf. In het bovenstaande geval is de sleutelnaam 'style' en de sleutelwaarde 'color:#0000FF'.

Op dezelfde manier kunt u voor gebruikersbesturingselementen uw eigen eigenschappen maken die het besturingselement beschrijven.

Laten we een eenvoudig voorbeeld nemen en daarop voortbouwen.Guru99Control' is in de voorgaande secties gemaakt. In ons voorbeeld voegen we een eenvoudige integer-eigenschap toe met de naam MinValue. Deze waarde vertegenwoordigt het minimum aantal tekens in de tekst die in het gebruikersbesturingselement wordt weergegeven.

Laten we de onderstaande stappen uitvoeren om dit op zijn plaats te krijgen.

Stap 1) Open de Guru99Control.ascx-bestand. Voeg de code toe voor het toevoegen van de MinValue-eigenschap.

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

Het scriptkenmerk runat=”server” wordt gebruikt om aan te geven dat we .NET-specifieke code toevoegen die op de webserver moet worden uitgevoerd. Dit is nodig voor het verwerken van elke eigenschap die aan het gebruikersbesturingselement wordt toegevoegd. Vervolgens voegen we onze eigenschap MinValue toe en geven deze een standaardwaarde van 0.

Stap 2) Laten we nu naar deze eigenschap verwijzen in ons demo.aspx-bestand. Het enige dat we nu doen is verwijzen naar de eigenschap MinValue en een nieuwe waarde van 100 toekennen.

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

NOTITIE: Als je deze code uitvoert, wordt er geen uitvoer weergegeven. Dit komt omdat de uitvoer onder de limiet van 100 tekens valt.

Veelgestelde vragen