AJAX設計模式實踐 之 可重新整理Ajax應用範例+Framework

本文是對AJAX設計模式 之 怎樣構建一個可重新整理的無重新整理應用一文中討論的“可重新整理Ajax設計模式”的實踐，包含了一個對以上設計模式的實現範例，以及全新支援“可重新整理Ajax設計模式”的AjaxHelper v0.7最新版本的介紹。

範例

大家可以先下載範常式序親自體驗！

線上示範

下載：RefreshableAjaxSample.zip

這是一個Asp.Net v1.1下的Web Application，點擊範例網頁中的任意連結，並嘗試驗擊瀏覽器的重新整理按鈕，或者按F5重新整理頁面，可以看到，雖然網頁功能是基於Ajax來實現的，但是，重新整理網頁時是不會丟失當前顯示內容的。

原理

 “可重新整理Ajax設計模式”的實現原理之前的文章中已有概述，這裡就不多說了，大家可以參見範例代碼！

架構

以上範例基於新版的AjaxHelper DotNet Version 0.7構建，在新版本的AjaxHelper中，為實現“可重新整理Ajax設計模式”提供了非常大的便利，具體的改進有：

1、新版本同時提供了AjaxHelper DotNet Version 和支援其它語言環境，如ASP, PHP, Perl等的AjaxHelper Flat Version（Flat版不包含對JSRS-JavaScript Remote Scripting的支援）；

2、將之前版本的AjaxHelper中的Updater, Appender等函數封裝到AjaxHelper命名空間，即新版本的函數必須以AjaxHelper.Updater...這樣的方式調用；

3、新增支援“可重新整理Ajax設計模式”的函數有：AjaxHelper.Params, AjaxHelper.Updater2, AjaxHelper.OnPageLoad。

其中，AjaxHelper.Params是一個HashTable，可以以AjaxHelper.Params['paramKey']這樣的方式獲得網頁連結中"#"之後的參數；AjaxHelper.Updater2地使用方法和AjaxHelper.Updater完全一致，只是提供了新的對“可重新整理Ajax設計模式”的隱含支援，調用方法可參見協助檔案或者參見我的Blog中之前的關於AjaxHelper的文章；AjaxHelper.OnPageLoad()需要被放置在網頁的body元素的onload事件中，以實現網頁重新整理時的狀態維持，可參見以上範例中具體的使用方法。

另外注意，在Flat版本中的所有ajaxTemplate參數必須是完整的網頁路徑，包括副檔名，而DotNet版中，ajaxTemplate必須是指向UserControl的路徑，可以包含.ascx副檔名，也可以不包含，建議不包含。

使用中如有任何問題或建議，歡迎給我留言！

下載

AjaxHelper_DotNet_v0.7.zip

AjaxHelper_Flat_v0.7.zip