2008年9月1日 星期一

分頁的action helper

很久之前就想要寫一個分頁的物件,本來的構想是在server端把資料的總頁數抓出來後,再送到client,使用jQuery的pagination plugin進行處理,不過如果完全由jQuery的plugin進行處理,會有安全性的問題,一定要由server端再進行確認的處理,同樣的事情,server端及client端,兩邊都要做,真的是有點囉嗦,後來就決定完全由server端進行分頁的處理。

server端的分頁物件的撰寫邏輯是這樣的:

如果頁數少於或等於十筆,就顯示全部頁數。

如果頁數大於十筆,就分成三種狀況做處理

目前頁數小於第五頁,就顯示1~5頁及最後兩頁,其他的用三個點號顯示

總頁數減目前頁數的絕對值小於或等於五頁,就顯示前二頁及最後五頁,其他的用三個點號顯示
非以上兩種狀況,就顯示前二頁及最後兩頁及目前頁數與目前頁數的前二頁與後二頁,其他的用三個點號顯示

分頁的外觀設定,就由client端的css做設定,server端的程式就專注在頁數的計算,將程式邏輯及外觀設定做清楚的切割。

分頁物件的css設定

在樣板中將server傳來的page資料用div包起來,設定顯示的css碼即可

假設div的設定是
server傳來的page資料


非目前頁數的css設定

.page ul li a{
css設定資料
}

目前頁數的css設定

.page ul li span{
css設定資料
}

整個物件花了不少時間思考,該怎麼做,想通後,心裡滿高興的,雖然網路上有非常多的分頁物件可以參考,不過要一行行拆解,真是花時間,而且看得頭昏眼花,眼睛不舒服,就不太想再看這些程式碼了,最後還是決定自己寫一個,比較能夠掌控,而且整個物件的用法也有一致性,不會感覺怎麼有個物件的用法跟整個程式的搭配度不太吻合。

沒有留言: