自寫的jQuery實作分頁功能的分頁元件:
功能效果如下:
分頁元件就是上圖中的三部分, 分别放在表格上部 和下部 。
其中,
1》》》頁面的代碼如下:
product.jsp
其中引用bootstrap.css 和bootstrap .js是必須的
View Code
2》》》分頁元件的js檔案
pageSet.js
3》》》本頁面的js中 需要提供資料的封裝功能 bindDate()方法,【并且注意,任何頁面發生變化的地方都需要調用分頁的page.pageSet();方法,例如資料的增加,資料的删除,還有page對象初始化,頁面初始化的時候就是這幾個地方需要調用】
3.1》》》product.js中的page對象初始化也就是在頁面初始化的時候+删除操作的時候
3.2》》》productAdd.js中添加一條資料完成後
4》》》controller伺服器中的處理方法
@Controller
@RequestMapping("geneInfo")
public class GeneInfoController {
5》》》Dao的實作層 的分頁實作
其中主要的思想 就是 将分頁元件 分離出來,僅作分頁處理。而資料的封裝則是在不同的頁面進行不同的封裝實作。然後封裝資料的方法作為參數傳遞給分頁對象。