Galileo Computing < openbook >
Galileo Computing - Programming the Net
Galileo Computing - Programming the Net


Einstieg in ASP.NET von Matthias Lohrer
Einstieg in ASP.NET
gp Kapitel 10 Webserversteuerelemente selbst erstellen
  gp 10.1 Benutzersteuerelemente (User Controls)
    gp 10.1.1 Ein einfaches Benutzersteuerelement erstellen
    gp 10.1.2 Die Control-Direktive
    gp 10.1.3 Die Register-Direktive für Benutzersteuerelemente verwenden
    gp 10.1.4 Die Basisklasse UserControl
    gp 10.1.5 Eigenschaften für Benutzersteuerelemente definieren
    gp 10.1.6 In Benutzersteuerelementen auf Ereignisse reagieren
  gp 10.2 Benutzerdefinierte Steuerelemente (Custom Controls)
    gp 10.2.1 Eine zählende Schaltfläche

Kapitel 10 Webserversteuerelemente selbst erstellen

ASP.NET bietet viele Bausteine für Webanwendungen. Darüber hinaus haben Sie die Möglichkeit, Ihre eigenen Bausteine zu erstellen.

ASP.NET bietet verschiedene Möglichkeiten, eigene Steuerelemente zu erstellen. Benutzersteuerelemente (User controls) sind Ausschnitte aus aspx-Dateien. Sie sind aus HTML- und ASP.NET-Skript-Bestandteilen aufgebaut. Noch weiter gehende Möglichkeiten bieten benutzerdefinierte Steuerelemente (Custom controls). Das sind selbst definierte Klassen, die Sie in Ihren aspx-Seiten ähnlich wie die Standard-Webserversteuerelemente einbinden können.


Galileo Computing

10.1 Benutzersteuerelemente (User Controls)  downtop

Die einfachste Kategorie selbst definierter Steuerelemente sind die Benutzersteuerelemente (User controls), die einen beliebigen Ausschnitt aus einer aspx-Seite aufnehmen können. Benutzersteuerelemente funktionieren ähnlich wie Include-Dateien. Im einfachsten Fall enthalten sie nur HTML-Code. Benutzersteuerelemente können aber auch Skripte enthalten, und Sie können für Benutzersteuerelemente auch eigene Eigenschaften und Ereignisse definieren.


Galileo Computing

10.1.1 Ein einfaches Benutzersteuerelement erstellen  downtop

Viele Websites enthalten auf allen Seiten am Seitenfuß einen Copyright-Hinweis. Diesen Bestandteil können Sie gut über ein Benutzersteuerelement auf allen Seiten einfügen. Als Ausgangssituation liegt beispielsweise die Datei user_01.aspx vor:

<!-- user_01.aspx --> 
<%@ Page Language="VB" Debug="True" Strict="True" %>
<html><head>
<title>Benutzersteuerelemente verwenden</title>
</head><body>
<h1>Benutzersteuerelemente verwenden</h1>
<p>Hier steht der Text ...</p>
<hr>
<center>© Matthias Lohrer 2002, 2003</center>
</body></html>

Die Passage von <hr> bis </center> taucht in dieser Form auf allen Seiten der Website auf. Dieser Abschnitt soll in ein Benutzersteuerelement ausgelagert werden, damit Sie bei einer Änderung, etwa in einem neuen Jahr, nicht alle Seiten der Website anpassen müssen.

So geht's: Die wiederkehrende Passage kopieren Sie in eine neue Datei und speichern sie unter einem Namen mit der Ergänzung ascx (c für Control statt p für Page), z. B. copyright.ascx. Am Anfang dieser Datei fügen Sie die Direktive <%@ Control %> (statt <%@ Page ...%>) ein:

<!-- copyright.ascx -->
<%@ Control %>
<hr><center>© Matthias Lohrer 2002, 2003</center>

Die neue Form von user_01.aspx speichern Sie unter dem Namen user_02.aspx. Hier führen Sie zwei Änderungen aus. Am Anfang der Seite registrieren Sie das Benutzersteuerelement mit der Register-Direktive:

<%@ Register Tagprefix="mlohrer" Tagname="copyright" src="copyright.ascx" %>

So wie bei asp:DataGrid etc. das asp das Präfix bildet, können Sie für Ihre eigenen Benutzersteuerelemente Ihr eigenes Präfix festlegen, indem Sie das Tagprefix-Attribut setzen. Mit dem Tagname-Attribut legen Sie den Namen fest und mit src geben Sie den Dateinamen an.

Im HTML-Teil der Seite rufen Sie das Benutzersteuerelement in dieser Form auf:

<mlohrer:copyright runat="server" />

Vergessen Sie nicht die Angabe runat="server"! So sieht die überarbeitete Seite im Zusammenhang aus:

<!-- user_02.aspx --> 
<%@ Page Language="VB" Debug="True" Strict="True" %>
<%@ Register Tagprefix="mlohrer" Tagname="copyright" src="copyright.ascx" %>
<html><head>
<title>Benutzersteuerelemente verwenden</title>
</head><body>
<h1>Benutzersteuerelemente verwenden</h1>
<p>Hier steht der Text ...</p>
<mlohrer:copyright runat="server" />
</body></html>

Die Ausgabe im Browser von user_02.aspx ist identisch mit der Ausgabe von user_01.aspx.


Achtung   Beachten Sie, dass in ascx-Dateien das form-Tag nicht auftauchen darf. Das form-Tag darf nur in der aspx-Datei enthalten sein, die das Benutzersteuerelement aufruft.


Galileo Computing

10.1.2 Die Control-Direktive  downtop

Eine ascx-Datei kann maximal eine Control-Direktive enthalten. Die verfügbaren Attribute entsprechend weit gehend den Attributen der Page-Direktive.


Atribut mögliche Werte Beschreibung
AutoEventWireup True (Default) oder False Bei True werden Ereignisse automatisch weitergeleitet.
ClassName String Der Klassenname für dieses Steuerelement
CompilerOptions Gültige Compiler-Optionen Compiler-Optionen, die zum Compiler weitergeleitet werden
Debug True oder False (Default) Bei True wird mit Debugsymbolen kompiliert.
Description Beschreibung Textliche Beschreibung
EnableViewState True (Default) oder False Bei True bleibt der Seitenstatus erhalten.
Explicit True oder False (Default) Bei True wird mit der Option Option Explicit kompiliert.
Inherits Eine von UserControl abgeleitete Klasse Legt die zugehörige Code-Behind-Klasse fest
Language Die von .NET unterstützten Sprachen Die verwendete Programmiersprache
Strict True oder False (Default) Bei True wird der Option Strict-Modus von VB.NET verwendet.
Src Gültiger Dateipfad Name der Quelldatei der Code-Behind-Klasse
WarningLevel Werte von 0 bis 4 Gibt an, bei welcher Warnungsebene der Compiler das Kompilieren abbrechen soll

Tabelle 10.1 Attribute der Control-Direktive


Galileo Computing

10.1.3 Die Register-Direktive für Benutzersteuerelemente verwenden  downtop

Bevor Sie ein Benutzersteuerelement in einer Seite verwenden können, müssen Sie es der Seite bekannt machen. Dazu verwenden Sie die Register-Direktive. Bei Benutzersteuerelementen hat die Register-Direktive immer diese Form:

<%@ Register tagprefix="myPrefix" 
             tagname="myTagname" 
             Src="myDateiPfad" %>

Galileo Computing

10.1.4 Die Basisklasse UserControl  downtop

Programmtechnisch gesehen sind Benutzersteuerelemente Klassen. Benutzersteuerelemente stammen immer von der Basisklasse System.Web.UI.UserControl ab. In der Control-Direktive des Benutzersteuerelements können Sie über das Attribut ClassName den Klassennamen für das Benutzersteuerelement ausdrücklich angeben. Es ist auch möglich, ein Benutzersteuerelement nicht direkt von der Klasse UserControl abzuleiten, sondern von einer anderen Klasse, die aber ihrerseits irgendwo in ihrem Stammbaum von UserControl abstammen muss. Dazu verwenden Sie das Inherits-Attribut der Control-Direktive. Durch die Verwendung des Src-Attributs können Sie außerdem die ascx-Datei mit einer Code-Behind-Datei verknüpfen.

Ein Benutzersteuerelement kann selbst andere Benutzersteuerelemente enthalten.

Die Klasse UserControl verfügt über einige Eigenschaften, die auch Page kennt. Dazu zählen etwa die Eigenschaften IsPostBack, Request, Response, Server und Session.

Weil Benutzersteuerelemente Klassen sind, können Sie mit ihnen entsprechend umgehen. Sie können ihnen beispielsweise Eigenschaften zuweisen, was im folgenden Abschnitt demonstriert wird.


Eigenschaften
Application HttpApplicationState Stellt das Application-Objekt zur Verfügung
Attributes AttributeCollection Eine Auflistung der Attribut-Wert-Paare, die in der aspx-Datei im Tag für das Benutzersteuerelement definiert sind
Cache Cache Das Cache-Objekt, das der Anwendung zugeordnet ist, in der das Benutzersteuerelement eingesetzt wird
IsPostBack Boolean True, wenn das Benutzersteuerelement als Antwort auf ein Postback geladen wird
Request HttpRequest Das Request-Objekt der aktuellen Anforderung
Response HttpResponse Das Response-Objekt der aktuellen Anforderung
Server HttpServerUtility Das Server-Objekt der aktuellen Anforderung
Session HttpSessionState Das Session-Objekt der aktuellen Anforderung
Trace TraceContext Das TraceContext-Objekt der aktuellen Anforderung
Methoden
InitializeAsUserControl(Page) Initialisiert das UserControl-Objekt, z. B.
myControl.InitializeAsUserControl(Me)
MapPath(virtualPath As String) String Ordnet dem virtuellen Verzeichnis den absoluten Dateipfad zu

Tabelle 10.2 Steckbrief der Klasse UserControl


Galileo Computing

10.1.5 Eigenschaften für Benutzersteuerelemente definieren  downtop

Das erste Beispiel für ein Benutzersteuerelement war sehr einfach, es enthielt nur statischen HTML-Code. Als Nächstes lernen Sie, beim Aufruf eines Benutzersteuerelements so etwas wie eine Variable zu übergeben, wodurch das Benutzersteuerelement flexibler wird. Programmtechnisch gesehen definieren Sie für die Klasse des Benutzersteuerelements eine Eigenschaft. Beim Aufruf des Benutzersteuerelements in der aspx-Seite legen Sie die Eigenschaft fest, indem Sie ein entsprechendes Attribut angeben.

Wenn Sie das Benutzersteuerelement für die Copyright-Angabe beispielsweise auf mehreren Websites verwenden wollen, dann wäre es praktisch, wenn der Name des Rechteinhabers variabel wäre.

So definieren Sie eine variable Eigenschaft für ein Benutzersteuerelement:

1. In der ascx-Datei fügen Sie im Skript-Abschnitt den nötigen Code hinzu, mit dem für eine Klasse eine Eigenschaft definiert wird. Für das Beispiel benötigen Sie eine Eigenschaft Firmenname. Das erweiterte Steuerelement bekommt den Namen copyright_02.ascx und hat diese Form.

<!-- copyright_02.ascx -->
<%@ Control Language="VB" Debug="True" Strict="True" %>
<script runat="server">
Private strFirma As String

   Public Property Firmenname() As String
      Get
         Firmenname = strFirma
      End Get
      
      Set (ByVal inFirmenname As String)
         strFirma = inFirmenname
      End Set
   End Property

</script>
<hr><center>© <% = Firmenname %> 2002, 2003</center>

Diese Definition der Eigenschaft Firmenname ist streng nach der objektorientierten Lehre entworfen. Mit Private strFirma As String deklarieren Sie zunächst eine private Variable, auf die nur die Klasse selbst Zugriff hat. Den öffentlichen Zugriff auf die Eigenschaft Firmenname ermöglichen Sie über die Property-Anweisung. Im HTML-Abschnitt des Benutzersteuerelements wird der Firmenname über eine einfache Inline-Anweisung eingefügt.

2. user_03.aspx ruft das erweiterte Benutzersteuerelement auf, indem das Skript im mlohrer:copyright-Element das Attribut Firmenname="Matthias Lohrer" hinzufügt.

<!-- user_03.aspx --> 
<%@ Page Language="VB" Debug="True" Strict="True" %>
<%@ Register tagprefix="mlohrer" tagname="copyright" 
             Src="copyright_02.ascx" %>
<html><head>
<title>Benutzersteuerelemente verwenden</title>
</head><body>
<h1>Benutzersteuerelemente verwenden</h1>
<p>Hier steht der Text ...</p>
<mlohrer:copyright runat="server" 
                   Firmenname="Matthias Lohrer" />
</body></html>

Galileo Computing

10.1.6 In Benutzersteuerelementen auf Ereignisse reagieren  toptop

In Benutzersteuerelementen können Sie ähnlich wie in aspx-Seiten auf Ereignisse reagieren. Wenn Sie in einem Benutzersteuerelement etwa Webserversteuerelemente einfügen, können Sie hier auch die benötigten Ereignisroutinen definieren. Auch Page_Load ist beispielsweise verfügbar. Ereignisse wie Page_Load und andere werden an die aufrufende aspx-Seite weitergeleitet, wenn in der Control-Direktive des Benutzersteuerelements die Standardeinstellung AutoEventWireup=True nicht verändert wurde.

Das folgende Beispiel demonstriert zwei Dinge. Zum einen sehen Sie, wie Sie Webserversteuerelemente in Ihren Benutzersteuerelementen verwenden können. Als Nebeneffekt erkennen Sie, dass Sie ein Benutzersteuerelement in eine Seite auch mehrfach einbinden können, ohne dass Sie diesen Fall im Code des Benutzersteuerelements selbst berücksichtigen müssten.

Viele Websites bieten die Option an, einen Newsletter zu abonnieren. Auf Ihrer Website möchten Sie verschiedene Newsletter anbieten und diese Option außerdem auf mehreren Seiten zur Verfügung stellen. Eine bestimmte Funktionalität wird also in jeweils leichter Abwandlung an mehreren Stellen benötigt, so dass die Realisierung als Benutzersteuerelement nahe liegt.

Abbildung
Hier klicken, um das Bild zu Vergrößern

Abbildung 10.1 Jedes Benutzersteuerelement bearbeitet seine Ereignisse selbst.

Abbildung
Hier klicken, um das Bild zu Vergrößern

Abbildung 10.2 Mehrfach eingebundene Benutzersteuerelemente erhalten im HTML-Code eindeutig unterscheidbare Namen.

user_04.ascx realisiert ein Benutzersteuerelement für ein solches E-Mail-Abo. user_04.aspx bindet das Benutzersteuerelement zweimal ein. Abbildung 10.1 zeigt die Darstellung von user_04.aspx im Browser und Abbildung 10.2 zeigt den erzeugten HTML-Quellcode.

<!-- user_04.aspx --> 
<%@ Page Language="VB" Debug="True" Strict="True" %>
<%@ Register Tagprefix="mlohrer" Tagname="emailabo" 
             Src="user_04.ascx" %> 
<html><head>
<title>Benutzersteuerelemente verwenden</title>
</head><body>
<h3>Wählen Sie einen Newsletter aus!</h3>
<form runat="server">
<mlohrer:emailabo runat="server"
        Newsletterthema="Alles über Wellensittiche" />
<mlohrer:emailabo runat="server"
        Newsletterthema="Alles über Hauskatzen" />
</form>
</body>
</html>
<!-- user_04.ascx -->
<%@ Control Language="VB" Strict="True" Debug="True" %>
<script runat="server">
Private txtThema As String

   Public Property Newsletterthema() As String
      Get
         Newsletterthema = txtThema
      End Get
      
      Set (ByVal inThema As String)
         txtThema = inThema
      End Set
   End Property

Public Sub emailabo (ByVal Sender As Object, _
                     ByVal E As CommandEventArgs)
   ausgabe.InnerHtml ="Sie erhalten den Newsletter<b> "
   ausgabe.InnerHtml += Newsletterthema
   ausgabe.InnerHtml += " </b>an die Adresse <b>"
   ausgabe.InnerHtml += txtEMail.value
   ausgabe.InnerHtml += "</b>."
End Sub

Sub Page_Load (ByVal Sender As Object, _
               ByVal E As EventArgs)
   Beschreibung.innerHtml = txtThema 
End Sub

</script>

<p style="background-color:#eeeeee;height:70pt" >
<b id="Beschreibung" runat="server" ></b><br>
<input type="text"
       id="txtEMail" 
       value="Ihre E-Mail-Adresse" 
       runat="server">
<asp:Button Text="News abonnieren" 
            runat="server"
            OnCommand="emailabo" /> <br>
<span id="ausgabe" runat="server" />
</p>

Der HTML-Teil des Benutzersteuerelements fasst alle Ausgabeelemente in einem einzelnen p-Element zusammen. Über das Attribut style="background-color:#eeeeee;height:70pt" bekommt der Absatz eine feste Höhe und einen hellgrauen Hintergrund zugewiesen. Für die Beschreibung wird ein b-Element zur Verfügung gestellt. Es folgen ein input-Element und ein asp:Button-Element für die Eingabe der E-Mail-Adresse. Für eine Feedback-Meldung wird ein span-Element bereitgestellt.

Beim Laden der aspx-Seite, in die dieses Benutzersteuerelement eingebunden wird, wird auch die Page_Load-Prozedur dieses Benutzersteuerelements ausgeführt. Dabei bekommt die Beschreibung die Variable txtThema zugewiesen.

txtThema ist eine private Variable, die nach außen über die Eigenschaft Newsletterthema zur Verfügung steht. Innerhalb der aspx-Seite wird das Newsletterthema gesetzt, indem bei der Deklaration ein entsprechendes Attribut angegeben wird:

<mlohrer:emailabo runat="server"
         Newsletterthema="Alles über Hauskatzen" />

Wenn der Anwender seine E-Mail-Adresse eingibt und News abonnieren anklickt, dann wird die Prozedur emailabo() ausgeführt. Innerhalb dieser Prozedur erstellt das Beispiel keine komplette E-Mail-Verwaltung, sondern gibt lediglich eine Meldung zur Bestätigung aus.

Beim Blick auf den HTML-Code wird auch klar, wie ASP.NET mit mehreren Benutzersteuerelementen auf einer Seite umgeht. ASP.NET vergibt für die input type="submit"-Elemente automatisch ein name-Attribut, so dass es die unterschiedlichen E-Mail-Abos voneinander unterscheiden kann.

  

Einstieg in VB.NET

VB.NET

Einstieg in C#

Visual C#

VB.NET und Datenbanken

Einstieg in XML




Copyright © Galileo Press GmbH 2003
Für Ihren privaten Gebrauch dürfen Sie die Online-Version natürlich ausdrucken. Ansonsten unterliegt das <openbook> denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.


[Galileo Computing]

Galileo Press GmbH, Gartenstraße 24, 53229 Bonn, Tel.: 0228.42150.0, Fax 0228.42150.77, info@galileo-press.de