Bei HTML-Server-Steuerelementen handelt es sich hauptsächlich um erweiterte Standard-HTML-Steuerelemente, die den Serverbetrieb sicherstellen. HTML-Steuerelemente werden nicht vom Server verarbeitet, sondern zur Anzeige an den Browser gesendet, z. B. Seitentitel-Tags, Link-Tags und Eingabeelemente.
Durch Hinzufügen des Attributs runat = „server“ und eines id-Attributs können sie gezielt in ein Serversteuerelement zur Verwendung in der serverseitigen Verarbeitung umgewandelt werden.
Beispiel: HTML-Eingabesteuerung:
<input type="text" size="40">Es kann durch Hinzufügen der Attribute runat und id in ein Serversteuerelement umgewandelt werden:
<input type="text" id="testtext" size="40" runat="server">Obwohl ASP.NET-Serversteuerelemente alles tun können, was HTML-Serversteuerelemente tun, haben HTML-Steuerelemente in den folgenden Situationen dennoch Vorteile:
Verwenden Sie statische Ausdrücke für Layoutzwecke.
Konvertieren Sie eine HTML-Seite zur Ausführung unter ASP.NET.
In der folgenden Tabelle werden HTML-Serversteuerelemente beschrieben:
| Kontrollname | HTML-Tag |
|---|---|
| HtmlHead | <head>Element |
| HtmlInputButton | <Eingabetyp=Schaltfläche|Senden|Zurücksetzen> |
| HtmlInputCheckbox | <Eingabetyp=Kontrollkästchen> |
| HtmlInputFile | <Eingabetyp = Datei> |
| HtmlInputHidden | <Eingabetyp = ausgeblendet> |
| HtmlInputImage | <Eingabetyp = Bild> |
| HtmlInputPassword | <Eingabetyp = Passwort> |
| HtmlInputRadioButton | <Eingabetyp = Radio> |
| HtmlInputReset | <Eingabetyp = Zurücksetzen> |
| HTMLText | <Eingabetyp = Text|Passwort> |
| HtmlImage | <img>-Element |
| HtmlLink | <link>Element |
| HtmlAnchor | <a>Element |
| HtmlButton | <button>-Element |
| HtmlButton | <button>-Element |
| HTMLForm | <form>-Element |
| HtmlTable | <table>-Element |
| HtmlTableCell | <td> und <th> |
| HtmlTableRow | <tr>Element |
| HtmlTitle | <title>-Element |
| HtmlSelect | <select&t;-Element |
| HtmlGenericControl | Alle HTML-Steuerelemente sind nicht aufgeführt |
Das folgende Beispiel verwendet eine einfache HTML-Tabelle für das Layout. Es verwendet Felder, um Benutzereingaben wie Name, Adresse, Stadt, Bundesland usw. einzuholen, und eine Schaltflächensteuerung, die beim Klicken die Benutzerdaten in der letzten Zeile der Tabelle anzeigt.
In der Entwurfsansicht sollte die Seite so aussehen:
Der Code für die Inhaltsseite zeigt die Verwendung von HTML-Tabellenelementen für das Layout.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="htmlserver._Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> <style type="text/css"> .style1 { width: 156px; } .style2 { width: 332px; } </style> </head> <body> <form id="form1" runat="server"> <div> <table> <tr> <td>Name:</td> <td> <asp:TextBox ID="txtname" runat="server" > </asp:TextBox> </td> </tr> <tr> <td>Street</td> <td> <asp:TextBox ID="txtstreet" runat="server" > </asp:TextBox> </td> </tr> <tr> <td>City</td> <td> <asp:TextBox ID="txtcity" runat="server" > </asp:TextBox> </td> </tr> <tr> <td>State</td> <td> <asp:TextBox ID="txtstate" runat="server"> </asp:TextBox> </td> </tr> <tr> <td> </td> <td></td> </tr> <tr> <td></td> <td ID="displayrow" runat ="server"> </td> </tr> </table> </div> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Click" /> </form> </body></html>Der Code hinter der Tastensteuerung lautet:
protected void Button1_Click(object sender, EventArgs e){ string str = ""; str += txtname.Text + "<br />"; str += txtstreet.Text + "<br />"; str += txtcity.Text + "<br />"; str += txtstate.Text + "<br />"; displayrow.InnerHtml = str;}Beachten Sie die folgenden Aussagen:
Für das Seitenlayout wurden Standard-HTML-Tags verwendet.
Die letzte Zeile der HTML-Tabelle wird für die Datenanzeige verwendet. Es erfordert eine serverseitige Verarbeitung. Fügen Sie daher ID-Attribute und Runat-Attribute hinzu.