iT邦幫忙

DAY 2
7

ASP.NET 由淺入深系列 第 2

91之ASP.NET由淺入深 不負責講座 Day2 - PostBack

You should know issues about PostBack
什麼是PostBack?
記得上一篇文章我們提到Post,也就是將form裡面的資料,經過submit,post到server端,server端可以接收到form的資料進行處理,且ASP.NET Webform只有一個form。

所以什麼是PostBack?
也就是Post+Back,Post給自己,或是Post回來自己這一頁。
將form裡面所有的資料,post回server端,且處理這個form的資料的URL,是同一個頁面來進行處理,我們稱為PostBack。

一般操作的方式,舉例來說:當Client端的User,點選Browser中網頁上的一個按鈕,這個click的動作向server發出Request至原本這個頁面,且將form裡面所有可獲得的資料post至server端。
該按鈕可能是存檔、送出、註冊、Next等等...這就是一個最常見的PostBack行為。

PostBack是怎麼運作的?
當form裡面,有server control的AutoPostBack設定為True時,則ASP.NET Webform會自動Render出一段ASP.NET產生的JavaScript:

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}

裡面有兩個參數,第一個參數為eventTarget, 簡單的說,就是PostBack是由哪一個物件所觸發的。第二個參數為eventArgument,簡單的說,就是觸發PostBack時,想要帶回去的argument值。
ASP.NET除了產生這一段JavaScript function以外,還會幫我們放上兩個hidden,分別為__EVENTTARGET跟__EVENTARGUMENT

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />

目的就是當觸發__doPostBack()時,最後將theForm submit到server端後,server端可以知道這一次的PostBack相關資訊。
而設定AutoPostBack為True的server control,則會在Render出來的HTML DOM裡面,onchange的事件,加上javascript:setTimeOut(呼叫__doPostBack('參數1','參數2'))

也就是當值有所改變時,要觸發__doPostBack(),且將觸發的Control和需要帶回server端的值,塞到hidden裡面,然後submit form,將form裡所有資料post至server端自己這一頁做處理。(包括剛剛的兩個hidden)

如何判斷這一次的Request,是不是PostBack?
基本上,這個問題可以很簡單,也可以很困難,
簡單來說,Page有一個屬性為IsPostBack,如果是True,就代表這次的Request是PostBack送出的。False,則代表這個Request,不是PostBack送出的(通常是Get)。
困難的部分,在於IsPostBack是怎麼判斷的,這需要反組譯ASP.NET的code,裡面有相當多的條件(沒記錯的話,有8個情況),來決定最後return true or false,這邊我們就不深入探討。

PostBack的目的為何?
ASP.NET Webform何以如此簡易可以上手?很大的原因就是把http的stateless處理封裝起來,讓developer沒有感覺到stateless。另外很大的原因,就是透過server control讓developer可以不用撰寫太多HTML和JavaScript。
為什麼要把這堆東西都封裝起來?因為要讓習慣撰寫Winform程式的developer盡可能的無痛升級,讓他們感受不到開發習慣的改變。
可以PostBack,來達到event-driven model的開發方式。

至於剛剛說的http的stateless怎麼解決,我們留著下一篇講viewstate再提。
至於怎麼樣可以不寫太多HTML和JavaScript,我們留著之後講server control再提。

最後,請想學習的客倌,看完這篇文章思考一下,下列的問題該如何回答:
1.什麼是PostBack?
2.PostBack是怎麼運作的?
3.要怎麼判斷這一次Request是不是PostBack?
4.PostBack的目的為何?
5.當設定AutoPostBack為True時,Render出來的HTML會有什麼變化?
6.PostBack一定會做的事是什麼?
7.Server端如何知道這一次的PostBack由誰觸發?(知道之後,就可以觸發對應的Control Event)


上一篇
91之ASP.NET由淺入深 不負責講座 Day1 - Get/Post
下一篇
91之ASP.NET由淺入深 不負責講座 Day3 - ViewState
系列文
ASP.NET 由淺入深30

2 則留言

0
魯大
iT邦高手 1 級 ‧ 2010-09-29 23:54:35

當每次做「PostBack」時,頁面總是會閃一下
若是在同一個頁面上做了太多的元件需要做「PostBack」的話
那使用者的眼睛一定很快就會受不了
有辦法讓這個閃一下不見嗎??

0
就是91
iT邦研究生 4 級 ‧ 2010-09-30 00:02:40

簡易版的,可以使用AJAX.NET的UpdatePanel。最後Render的部分是透過ajax的效果去做Partial Render,所以畫面不會閃一下。原理可以參考:http://www.dotblogs.com.tw/hatelove/archive/2009/02/10/7091.aspx

中階版的可以使用AJAX.NET裡面的PageMethod,透過JavaScritp呼叫code-behind的public static function,可以參考:http://www.dotblogs.com.tw/hatelove/archive/2009/01/05/6639.aspx

進階版的,可以使用真正的ajax,透過JavaScript去對Server進行Request,再使用JavaScript將Server端回傳的String (maybe string, XML, SOAP, JSON格式),bind到HTML的DOM上面。可以參考:http://www.dotblogs.com.tw/hatelove/archive/2009/12/22/jqueryajax.aspx

我要留言

立即登入留言