PageRequestManager - ASP.NET Ajax
PageRequestManager是ASP.NET Ajax用來管理非同步Client的操作方式，前陣子為了避免網頁重覆送出的問題，和同事們討論之後，決定利用「蓋玻璃」的方式，替整個網頁加上一層透明的DIV，防止User重覆按下送出的動作。
因為整個網站是採用ASP.NET Ajax開發，所以大部份的資料更新動作都是透過update panel來執行；因此，在回到server前，ajax會先呼叫一次
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest()這個方法，等到update panel執行完成之後，會再呼叫一次
Sys.WebForms.PageRequestManager.getInstance().add_endRequest()，所以可以透過這二個方式來達到效果建立及取消。
以下是截自官方網站的範例：
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args)
{
var elem = args.get_postBackElement();
ActivateAlertDiv('visible', 'AlertDiv', elem.value + ' processing...');
}
function EndRequestHandler(sender, args)
{
ActivateAlertDiv('hidden', 'AlertDiv', '');
}
function ActivateAlertDiv(visstring, elem, msg)
{
var adiv = $get(elem);
adiv.style.visibility = visstring;
adiv.innerHTML = msg;
}
</script>
不過為了讓user一按下按鈕就無法動作，所以效果開始這段我是寫在button的onclientclick上面，再利用add_endRequest來取消效果。
1.先在網頁上放置一個div
<img alt="waiting" src="/App_Themes/images/indicator.gif" />
Please wait a moment...
</div>2.再來是javascript的動作
先取到整個body的大小，然後把div放到跟body一樣大即可！
function EndRequestHandler(sender, args)
{
showBusyContainer(false);
}
function showBusyContainer(show)
{
if(show==true)
{
Sys.UI.DomElement.toggleCssClass(document.body, "HiddenSelect");
var bodyWidth = jQuery("body").outerWidth();
var bodyHeight = Math.max(jQuery("body").outerHeight(), jQuery(window).height());
var boxHeight = jQuery(".busybox").outerHeight();
jQuery(".overlay").show()
.css({ width:bodyWidth, height:bodyHeight});
jQuery(".busybox").show()
.css({ left: (bodyWidth - jQuery(".busybox").width()) / 2, position:"absolute", top:bodyHeight / 2 - boxHeight });
}
else
{
jQuery(".overlay").hide();
jQuery(".busybox").hide();
jQuery("body").removeClass("HiddenSelect");
}
}
