在本系列之三《asp.net夜話之三:表單和控件》中講到了HTML服務器控件,HTML服務器控件有如下特點:
(1)HTML服務器控件是建立在HTML控件的基礎上,額外增加了一個在當前頁面中唯一的ID屬性值和一個runat=”server”屬性;(2)HTML服務器控件必須放在服務器端表單中,也就是必須在<form runat=”server” id=”form表單ID”></form>標記之中。(3)HTML服務器控件最終在Web服務器處會被解釋成普通HTML控件標記發送到客戶端浏覽器。asp.net服務器控件是微軟為了方便開發者開發而推出的一系列控件,它們都以類似<asp:* ID="btnOK" runat="server" …/>的方式出現在Visual Studio 2005的源視圖裡,*代表了控件名,如<asp:Button ID="btnOK" runat="server" Text="提交" />就表示這是一個Button控件。asp.net服務器控件除了提供HTML服務器控件所能提供的功能之外,還有很多功能更為復雜的控件。這些控件可以分為簡單控件、容器控件、數據綁定控件、數據源控件和數據驗證控及用戶自己根據自己業務需要將一些控件組合在一起組成的用戶控件等。asp.net控件的特點與HTML服務器控件類似,也有如下特點:(1)asp.net服務器控件必須有一個在當前頁面中唯一的ID屬性和runat=”server”屬性;(2)asp.net服務器控件必須放在服務器端表單中;(3)asp.net服務器控件最終會被解釋成普通HTML標記發送到客戶端浏覽器。
本文主要介紹以下控件:
Button控件TextBox控件Web服務器控件的特殊客戶端事件FileUpload控件Literal控件Panel控件PlaceHolder控件
Button控件
Button控件是asp.net開發時最常見的控件之一,我們創建一個頁面名為ServerControl.aspx,下面就是這個頁面的前台代碼:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ServerControl.aspx.cs" Inherits="ServerControl" %>
<!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>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="0" width="100%">
<tr><td>
</td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td><asp:Button ID="btnOK" runat="server" Text="提交" /></td><td></td></tr>
</table>
</div>
</form>
</body>
</html>
這個頁面在客戶端一個只有一個提交按鈕的頁面,我們點擊這個按鈕的時候頁面會刷新,它在客戶端浏覽器的HTML代碼如下:
<!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><title>
無標題頁
</title></head>
<body>
<form name="form1" method="post" action="ServerControl.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTQ2OTkzNDMyMWRkT/VDzJ0SWn3BqgG/UOUV4Cqu7NY=" />
</div>
<div>
<table border="0" width="100%">
<tr><td>
</td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td><input type="submit" name="btnOK" value="提交" id="btnOK" /></td><td></td></tr>
</table>
</div>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKFss63DQLdkpmPAbagjAxymGXZUaR5sNMBZHmUjoKd" />
</div></form>
</body>
</html>