這裡需要提一下的是,asp.net編程提供了服務端控件和客戶端控件的說法,其實還是脫離不了HTML的本質,客戶端和服務端需要交互必須要提交,提交有兩種方式get和post,get就是通過向服務端發送連接地址,服務端通過地址的參數來獲得信息的,一般這些參數都是明文,能在浏覽器地址欄看到。而post是通過表單的input等元素提交到服務端的頁面的,這些數據一般是看不到的。asp.net的服務端控件其實就是對一般的HTML控件做了個包裝,大體是通過隱藏控件提供控制的參數的。
這裡介紹一個常用的函數_doPostBack,這個函數如果如果是ASP.Net render出來的頁面就是自動產生這個函數,比如有帶autopostback屬性的控件,且其屬性為true的頁面,帶編輯列的datagrid頁面。
__doPostBack是通過__EVENTTARGET,__EVENTARGUMENT兩個隱藏控件向服務端發送控制信息的,__EVENTTARGET為要調用控件的名稱,如果要調用的控件是子控件,用''$'或':'分割父控件:子控件,__EVENTARGUMENT是調用事件時的參數
下面演示下如何調用後台事件:
1.新建工程
2.拖入一個服務端Button1,一個DropDownList1和一個客戶端Button
3.設置DropDownList1的AutoPostBack屬性為True,Button1的Visible為False
4.雙擊Button1,在事件裡寫下Response.Write("hello:" );
5.頁面的HTML裡找到客戶端Button,寫入onclick="__doPostBack('Button1','')"
6.編譯,運行,點擊Button是不是出現了"Hello"
7.查看源代碼,發現裡面多了下面行
復制代碼 代碼如下:
<script language="javascript">
<!--
function __doPostBack(eventTarget, eventArgument) {
var theform;
if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
theform = document.forms["Form1"];
}
else {
theform = document.Form1;
}
theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
theform.__EVENTARGUMENT.value = eventArgument;
theform.submit();
}
// -->
</script>
以及兩個隱藏控件
復制代碼 代碼如下:
<input type="hidden" name="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" value="" />
值得注意的是,_doPostPack的第一個參數是大小寫不敏感的
細心的人會發現,在__doPostBack裡,提交調用的是theform.submit(),這樣就導致對Form的onsubmit事件校驗失效了,幸好這個問題在asp.net 2.0已經修復了。這裡提供一個替換的解決辦法,在Form的最下面插入下面的代碼,這段代碼在保證不管是不是render出來的頁面均有效
復制代碼 代碼如下:
<script language="javascript">
<!--
function __doPostBack_Ex(eventTarget, eventArgument)
{
var theform;
if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
theform = document.forms[0];
}
else {
theform = document.forms[0];
}
if(!theform.__EVENTTARGET)
{
theform.appendChild(document.createElement("<input type='hidden' name='__EVENTTARGET'>"));
}
if(!theform.__EVENTARGUMENT)
{
theform.appendChild(document.createElement("<input type='hidden' name='__EVENTARGUMENT'>"));
}
theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
theform.__EVENTARGUMENT.value = eventArgument;
if ((typeof(theform.onsubmit) == "function"))
{
if(theform.onsubmit()!=false)
{
theform.submit();
}
}
else
{
theform.submit();
}
function __doPostBack(eventTarget, eventArgument)
{
__doPostBack_Ex(eventTarget, eventArgument);
}
}
// -->
</script>