jQuery Ajax based DotNetNuke 模組解決上一頁下一頁問題

純粹用jQuery ajax 寫的模組會使瀏覽器上一頁/下一頁的動作不正確, 因此要改用URL區分不同的動作, 上一頁/下一頁才會正常作用.

實作如下:

Step 1.加入2個Hidden field作為Server端和Client端溝通的變數.

Step 2.新增一public method, 供 Client 端取得模組所在 Tab 的 URL:

Step 3.程式一開始即使用jQuery Ajax呼叫 Web Method 取得 Category List, 並在毎個Category item 加上 click event,

click event 會post back 回模組本身並帶上2個參數, 告訴模組下次回Client端時要做什麼事.

Step 4. 按下 Category 後, Page_Load 會收到2個參數, 把它設到 Hidden field, 以便 Client 端取用:

Step 5.Response 回 Client 端後依Hidden field 的值決定要秀的內容

Step 6.實作GetCategoryProducts() function

測試結果, 如下2圖

點選不同分類的URL內容不同, post back回Server由於只處理2個hidden field的值, 取得分類及產品列表的動作交給ajax去做, 回應非常快速, 如此解決了上一頁/下一頁動作不正確的問題, 同時又保留了ajax非同步處理的優點.