Ajax組件改進客戶體驗PPT學習教案

1、會計學1Ajax組件改進客戶體驗組件改進客戶體驗手寫Ajax 代碼有什么缺點？第1頁/共23頁第2頁/共23頁第3頁/共23頁第4頁/共23頁操作演示：使用操作演示：使用ScriptManager 第5頁/共23頁 /初始化客戶端腳本控制器初始化客戶端腳本控制器引用引用Ajax Library 中的腳本中的腳本第6頁/共23頁 演示示例演示示例1：ScriptManager 注冊腳本注冊腳本第7頁/共23頁演示示例演示示例2：ScriptManager 調用調用Web Service第8頁/共23頁System.Web.Script.Services.ScriptServicepublic c

2、lass WebService : System.Web.Services.WebService public WebService() WebMethod public int Add(int a, int b) return a + b; function callService() WebService.Add(document.getElementById(input1) .value,document.getElementById(input2).value, processCallBack);/ WebService 為類名為類名 function processCallBack(

3、result) document.getElementById(result).value = result; 第9頁/共23頁第10頁/共23頁母版頁添加了一個ScriptManager ，如何 在內容頁中注冊Web Service? 語法和語法和ScriptManager類似類似第11頁/共23頁設置采用獲取服務器端資源的方式，設置采用獲取服務器端資源的方式，包括包括Always和和Conditional兩種模式兩種模式Always：每次請求時無條件刷新面板內容：每次請求時無條件刷新面板內容Conditional：有觸發(fā)條件的更新：有觸發(fā)條件的更新兩個重要的子元素：兩個重要的子元素：內容模

4、板，類似：內容模板，類似GridView等控件的模板列等控件的模板列：相當于觸發(fā)器，只有滿足條件后才更新：相當于觸發(fā)器，只有滿足條件后才更新第12頁/共23頁單擊單擊“查詢查詢”和頁號，不刷新整個頁面和頁號，不刷新整個頁面演示示例演示示例3：無刷新的圖書列表顯示：無刷新的圖書列表顯示第13頁/共23頁 . . asp:GridView runat=server ID=gvBooks . 把需要更新的部分放在內容模板中把需要更新的部分放在內容模板中第14頁/共23頁演示示例演示示例4：無刷新顯示時間：無刷新顯示時間第15頁/共23頁 添加添加Triggers屬性屬性實現(xiàn)有條件刷新實現(xiàn)有條件刷新可

5、以不放在可以不放在UpdatePanel 中中第16頁/共23頁演示示例演示示例5： “第三波書店第三波書店”評論功能評論功能第17頁/共23頁ScriptManager.RegisterClientScriptBlock( this.txtComment, /UpdatePanel 中的任意控件中的任意控件 typeof(TextBox), /正在注冊該腳本的控件的類型正在注冊該腳本的控件的類型 alert, /腳本塊的唯一標識符腳本塊的唯一標識符 alert(請先登錄再發(fā)表評論！請先登錄再發(fā)表評論！), /腳本腳本 true /是否用是否用 和和 標記括起該腳本塊標記括起該腳本塊);Scr

6、iptManager.RegisterClientScriptBlock( this.Page, /注冊該客戶端腳本塊的頁對象注冊該客戶端腳本塊的頁對象 this.GetType(), /正在注冊該腳本的控件的類型正在注冊該腳本的控件的類型 alert, /腳本塊的唯一標識符腳本塊的唯一標識符 alert(書籍評論不能超過書籍評論不能超過500字！字！), /腳本腳本 true /是否用是否用 和和 標記括起該腳本塊標記括起該腳本塊 );重載方法一重載方法一重載方法二重載方法二第18頁/共23頁等待中的友情提示等待中的友情提示第19頁/共23頁演示示例演示示例6： “第三波書店第三波書店”提交評論等待提交評論等待第20頁/共23頁protected void btnSubmit_Click(object sender, EventArgs e) System.Threading.Thread.Sleep(2000);后臺關鍵代碼后臺關鍵代碼 正在數(shù)