Peter Bucher - Mein Experiment, meine Spielereien, meine Welt...   ·   Stefan Falz   ·   Jürgen Gutsch   ·   Golo Roden   ·   ASP.NET Zone   ·   Microsoft ASP.NET
Willkommen bei ASP.NET Zone. Anmelden | Registrieren | Hilfe

Login Control Aussehen und Output per Template anpassen

ASP.NET hat diverse Steuerelemente für den Login- und Registrierungsprozess.
In vielen Fällen hat man das Problem, dass die Ausgabe oder der resultierende Quelltext nicht dem entspricht, was man möchte.

Im ersten Moment gibt es da ein paar Optionen:

  1. Ein CustomControl vom Login Control ableiten, und die Render Methoden überschreiben
  2. Ein vollkommen eigenes Login Control entwickeln, evt. Membership Unterstützung einbauen
  3. Control Adapter benutzen
  4. Selber einen Control Adapter schreiben

Okay, irgendwie ist das alles zu viel Aufwand, das muss doch einfacher gehen? Ja das geht auch einfacher!
ASP.NET und die Steuerelemente an sich bieten schon von sich aus Template Unterstützung, das ohne grossen Aufwand und weitgehenst flexibel.
Ich möchte euch anhand eines kurzen Beispiels zeigen, wie einfach und doch genial diese Unterstützung ist.

Wir brauchen dazu ein Login Steuerelement, das wir je nach Belieben per Maus auf den Designer ziehen oder es selber im ASPX Code deklarieren:

<asp:Login id="loginTest" runat="server" />

 

Um die Template Möglichkeit zu nutzen, brauchen wir einen Tag der nicht selbstschliessend ist.
Innerhalb dieses Tags bietet uns Visual Studio die Eigenschaft "LayoutTemplate".

<asp:Login id="loginTest" runat="server">
    <LayoutTemplate>
        <!-- Template goes here -->
    </LayoutTemplate>
</asp:Login>

 

In diesem Template kann man die benötigten oder optionalen Controls für das Login, und den gewünschten Html Code selber setzen.
Wir verpassen den Controls eine ID, die in der MSDN zu finden ist. Somit findet das Login Control das entsprechende Control.
Der Benutzernamen-TextBox verpassen wir die ID "UserName". Die verfügbaren IDs sind in der MSDN dokumentiert, und für das Login Control hier zu finden: Login.LayoutTemplate-Eigenschaft.
ASP.NET baut hier auf Interfaces (Schnittstellen). Für "UserName" muss das verwendete Control das Interface IEditableTextControl implementieren.

Unsere ASPX Deklaration sieht schlussendlich z.B so aus:

<asp:Login id="loginTest" runat="server">
    <LayoutTemplate>
        Benutzername:<br />
        <br ID="UserName" Width="150" runat="server" />
        Passwort:<br />
        <br ID="Password" Width="150" runat="server" />
        <asp:CheckBox ID="RememberMe" runat="server" />
        <asp:Label
            ID="lblRememberMe"
            AssociatedControlID="RememberMe"
            Text="Passwort speichern?"
            runat="server" />
            <br />
        <asp:Button ID="btnSubmit" Text="Anmelden" CommandName="Login" runat="server" />
    </LayoutTemplate>
</asp:Login>

 

Der resultierende Html Quellcode sieht jetzt um einiges sauberer aus.

Wenn die "AssociatedControlID" Eigenschaft gessetzt ist, passiert zusätzlich folgendes:
Das Label wird als "Label"-Tag und nicht als "Span"-Tag gerendert. Damit kann man das Label anklicken und die CheckBox damit bedienen.

Andere Anwendungsfälle:
Genau so wie im oben stehenden Beispiel können auch alle Steuerelemente verwendet werden, die Vorlagen unterstützen.
Bei den Login Steuerelementen sind dies zusätzlich zu dem Login Control auch noch die PasswordRecovery, CreateUserWizard und ChangePassword Controls.

Alle Steuerelemente, welche die entsprechende Schnittstelle implementieren, können im Template verwendet werden. So können wir auch eigene Steuerelemente einsetzen.
In unserem Beispiel könnten wir bspw. ein neues Control von TextBox ableiten, zusätzliche Funktionalität hinzufügen und dieses im Template nutzen.
Somit ist diese Lösung extrem flexibel einsetzbar.

Quellen und zusätzliche Links:

Korrektur:
Die CommandName Eigenschaft des Buttons muss auf "Login" gesetzt sein,
damit es erkannt wird. Ich habe den ASPX Code dahingehend angepasst.
Danke für den Hinweis an Jürgen Gutsch.

Veröffentlicht Mittwoch, 11. Juli 2007 21:38 von Peter Bucher

Kommentare

# Alles neu oder was?

Info &amp; Statistiken Ja, es gibt Neuigkeiten auf meinem Blog, aber es ist nicht alles neu ;-) Unter

Freitag, 24. August 2007 01:45 by Peter Bucher

# re: Login Control Aussehen und Output per Template anpassen

Hi Peter,

ein kleiner Hinweis zu dem LayoutTemplate, das du hier gepostet hast:

Beim Button muss unbedingt das Attribut "CommandName" auf "Login" gesetzt werden, sonst funktioniert das Login nicht:

<asp:Button ID="btnSubmit" Text="Anmelden" runat="server" CommandName="Login" />

Siehe:

http://msdn2.microsoft.com/de-de/library/ms178339(VS.80).aspx

Freitag, 24. August 2007 09:07 by Jürgen Gutsch

# re: Login Control Aussehen und Output per Template anpassen

Hi Jürgen

Vielen Dank für deinen Hinweis und den Link, ich habe den Beitrag dahingehend abgeändert.

Samstag, 25. August 2007 12:40 by Peter Bucher
Anonyme Kommentare sind nicht zugelassen