透過ASP.NET AJAX 4 Client Libraries實現 Modal Popup Window

現在很多網站都導入了AJAX技術,透過AJAX技術在網頁上實現類似Windows的強制回應視窗(Modal Popup Window)效果,像FaceBook、Google都有廣泛的使用這些功能。

底下連結的這個範例介紹如何透過ASP.NET AJAX Client Libraries,不需要引用特定.dll,只需要參考MS CDN即可輕鬆在網頁上建立這樣的凸顯式強制回應視窗功能。

程式碼約莫如下:

< script type="text/javascript" >
Sys.debug = true;
Sys.require([Sys.components.watermark, Sys.components.modalPopup], function () {
$("#Button1").modalPopup({
PopupControlID: "window", //視窗物件名稱
OkControlID: "buttonOK", //設定OK鈕物件
CancelControlID: "buttonCancel", //設定OK鈕物件
OnOkScript: okayWasClicked, //按下Cancel鈕要做的事情
OnCancelScript: cancelWasClicked, //按下Cancel鈕要做的事情
BackgroundCssClass: "modalBackground" //背景顏色
});
$("#UserName").watermark("<請輸入姓名>", "watermark");
$("#Pwd").watermark("<請輸入密碼>", "watermark");
});
//按下OK鈕要做的事情
function okayWasClicked() {
Sys.get("#Label1").innerText = "返回確定";
}
//按下Cancel鈕要做的事情
function cancelWasClicked() {
Sys.get("#Label1").innerText = "返回取消";
}

完成程式碼請[下載]

留言

這個網誌中的熱門文章

使用 Airtable 在小型需求上取代傳統資料庫

在POC或迷你專案中使用 LiteDB

專業的價值...

精彩(且驚人)的Semantic Kernel入門範例

周末讀書會 - 一如既往