عناصر تحكم خادم HTML هي بشكل أساسي عناصر تحكم HTML قياسية محسنة تضمن تشغيل الخادم. لا تتم معالجة عناصر تحكم HTML بواسطة الخادم، ولكن يتم إرسالها إلى المتصفح للعرض، مثل علامات عنوان الصفحة وعلامات الارتباط وعناصر الإدخال.
من خلال إضافة سمة runat = "server" وسمة المعرف، يمكن تحويلهما بشكل خاص إلى عنصر تحكم خادم لاستخدامه في المعالجة من جانب الخادم.
على سبيل المثال، التحكم في إدخال HTML:
<input type="text" size="40">يمكن تحويله إلى عنصر تحكم خادم عن طريق إضافة سمات runat وid:
<input type="text" id="testtext" size="40" runat="server">على الرغم من أن عناصر تحكم خادم ASP.NET يمكنها القيام بكل ما تفعله عناصر تحكم خادم HTML، إلا أن عناصر تحكم HTML لا تزال تتمتع بمزايا في المواقف التالية:
استخدم التعبيرات الثابتة لأغراض التخطيط.
تحويل صفحة HTML لتعمل تحت ASP.NET.
يصف الجدول التالي عناصر تحكم خادم HTML:
| اسم التحكم | علامة HTML |
|---|---|
| هتملهيد | عنصر <الرأس> |
| HTMLInputButton | <نوع الإدخال=زر|إرسال|إعادة تعيين> |
| HtmlInputCheckbox | <نوع الإدخال=مربع الاختيار> |
| htmlInputFile | <نوع الإدخال = ملف> |
| HTMLInputHidden | <نوع الإدخال = مخفي> |
| HTMLInputImage | <نوع الإدخال = الصورة> |
| HTMLInputPassword | <نوع الإدخال = كلمة المرور> |
| HTMLInputRadioButton | <نوع الإدخال = الراديو> |
| htmlInputReset | <نوع الإدخال = إعادة التعيين> |
| نص HTML | <نوع الإدخال = نص|كلمة المرور> |
| HTMLImage | عنصر <img> |
| هتمللينك | <الرابط>العنصر |
| HTMLAnchor | <أ> العنصر |
| زر هتمل | عنصر <زر> |
| زر هتمل | عنصر <زر> |
| HTMLForm | عنصر <النموذج> |
| HTMLTable | عنصر <الجدول> |
| htmlTableCell | <td> و <th> |
| htmlTableRow | <tr>عنصر |
| عنوان HTML | عنصر <العنوان> |
| أتش تي أم أل سيليكت | <اختر&t; |
| HTMLGenericControl | كافة عناصر تحكم HTML غير مدرجة |
يستخدم المثال التالي جدول HTML أساسي للتخطيط. ويستخدم مربعات للحصول على مدخلات من المستخدم مثل الاسم والعنوان والمدينة والولاية وما إلى ذلك، وزر التحكم الذي عند النقر عليه يحصل على بيانات المستخدم المعروضة في الصف الأخير من الجدول.
يجب أن تبدو الصفحة بهذا الشكل في طريقة عرض التصميم:
يُظهر رمز صفحة المحتوى استخدام عناصر جدول HTML للتخطيط.
<%@ 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>الكود الموجود خلف زر التحكم هو:
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;}لاحظ العبارات التالية:
تم استخدام علامات HTML القياسية لتخطيط الصفحة.
يتم استخدام الصف الأخير من جدول HTML لعرض البيانات. يتطلب معالجة من جانب الخادم، لذا أضف سمة المعرف وسمة التشغيل إليه.