Gridview 自訂分頁
首先，畫面上要有個 Gridview
這邊坎尼偷懶用了 SqlDataSource 見下圖
可以看到 Pager 已經出現了 來看一下原始碼 如下圖
要自訂分頁第一個要件就是 把 Gridview 的 allow paging 設為 true
再來就是在 Gridview 上按右鍵 選 EditTemplate -> PagerTemplate
就會進入到編輯畫面 再把要加入的 Controls 拖進去
如果嫌 Design 模式很難用 想用原始碼去編輯
就直接在 Gridview 的 PageTemplate 把 Controls 給拖進去
沒看到 PageTemplate 怎麼辦? 自己打啊 XDD
再來解說一下坎尼這個自訂分頁
控制項分別為 Label LinkButton*4 DropDownList Label
LinkButton皆有設定 CommandArgument 及 OnClick事件
DropDownList 也有 SelectedIndexChanged 事件
這些稍後會提到 先來看一下實際畫面
以下就來解說分頁事件是如何進行
首先是 DropDownList 的 SelectedIndexChanged 事件
很簡單 只要把 SelectedIndex 設定給 Gridview 的 PageIndex 即可
這邊要注意的地方有兩個
要取得 Pager 裡的 DropDownList 記得是用 Gridview.BottomPagerRow
(當然 如果 PagerRow 設定為在表格上方 就是用 Gridview.TopPagerRow)
再來就是被註解起來的 GetData() 函式
因為坎尼這範例是用 SqlDataSource 當資料來源的方式
所以並不需要特別去做資料繫結的動作 只要 PostBack 即可
但如果是要自行取得 DataSource 來繫結
這邊的 GetData() 就是取代各位的 取得 DataSource 的函式
接下來是 LinkButton 的 Click 事件
先是取得目前按下的 LinkButton 是哪個鍵
分別有 第一頁 上一頁 下一頁 及 最後一頁
會依點下的按鍵不同 計算該到哪一頁
再把 index 設給 Gridview.PageIndex
同樣的 這邊的 GetData() 函式作用如上面解說
接下來就是這個自訂分頁的精華部分
先是在 Gridview 的 DataBound 事件加入 pageSet() 函式
這函式需要傳入要分頁的 Gridview
當然 若是通通寫在同一個 class 就可以省了把 Gridview 傳入
可是 為了增加程式彈性及提高重複使用率 建議是多寫一道手續
(比方講 把這個函式包在另一個 class 或是 寫成User Control)
下圖就是最麻煩 坎尼已經想睡了不太想講的部分
好啦 還是解說一下 (大家可以點圖放大 看一下程式在幹嘛)
首先 把傳入的 object 轉為 Gridview
再將 Gridview 的 PagerRow裡的 Controls 取出做處理
顯示全部筆數 目前先給 pageCount * pageSize (當然 這邊是不準的 要再做其他處理)
顯示全部頁數 給 pageCount
接下來 取得跳頁用的 DropDownList 並重新給予 Item
「這樣不會每次 DataBound 就重覆的把 item 給加進去嗎?」
不會的 因為這邊是動態產生
所以只要 PostBack 下拉選單的 Items 就會被清空
因此才要再重新把項目給加回去
再來的就是判斷 LinkButton 是否作用
最後再把下拉選單設定為目前的頁數
其實這個函數最外層還要加個判斷 if(gv.PageCount > 1)
因為 GridView 預設 如果無分頁(頁數小於1) 則不顯示 PagerRow
這段程式碼就會因此出現 Exception
下面就是實際操作畫面
這篇真是又臭又長 希望有人有耐心看到這邊 XD
最後再提一個東西 DataPager
這是 .net framework 3.5 新增的控制項
目的也是在做分頁的顯示及控制
可惜目前只支援 ListView 控制項
若是想在 Gridview 上要自己做美美的分頁
還是只能靠自己寫分頁樣板及事
件
這邊坎尼偷懶用了 SqlDataSource 見下圖
可以看到 Pager 已經出現了 來看一下原始碼 如下圖
要自訂分頁第一個要件就是 把 Gridview 的 allow paging 設為 true
再來就是在 Gridview 上按右鍵 選 EditTemplate -> PagerTemplate
就會進入到編輯畫面 再把要加入的 Controls 拖進去
如果嫌 Design 模式很難用 想用原始碼去編輯
就直接在 Gridview 的 PageTemplate 把 Controls 給拖進去
沒看到 PageTemplate 怎麼辦? 自己打啊 XDD
再來解說一下坎尼這個自訂分頁
控制項分別為 Label LinkButton*4 DropDownList Label
LinkButton皆有設定 CommandArgument 及 OnClick事件
DropDownList 也有 SelectedIndexChanged 事件
這些稍後會提到 先來看一下實際畫面
以下就來解說分頁事件是如何進行
首先是 DropDownList 的 SelectedIndexChanged 事件
很簡單 只要把 SelectedIndex 設定給 Gridview 的 PageIndex 即可
這邊要注意的地方有兩個
要取得 Pager 裡的 DropDownList 記得是用 Gridview.BottomPagerRow
(當然 如果 PagerRow 設定為在表格上方 就是用 Gridview.TopPagerRow)
再來就是被註解起來的 GetData() 函式
因為坎尼這範例是用 SqlDataSource 當資料來源的方式
所以並不需要特別去做資料繫結的動作 只要 PostBack 即可
但如果是要自行取得 DataSource 來繫結
這邊的 GetData() 就是取代各位的 取得 DataSource 的函式
接下來是 LinkButton 的 Click 事件
先是取得目前按下的 LinkButton 是哪個鍵
分別有 第一頁 上一頁 下一頁 及 最後一頁
會依點下的按鍵不同 計算該到哪一頁
再把 index 設給 Gridview.PageIndex
同樣的 這邊的 GetData() 函式作用如上面解說
接下來就是這個自訂分頁的精華部分
先是在 Gridview 的 DataBound 事件加入 pageSet() 函式
這函式需要傳入要分頁的 Gridview
當然 若是通通寫在同一個 class 就可以省了把 Gridview 傳入
可是 為了增加程式彈性及提高重複使用率 建議是多寫一道手續
(比方講 把這個函式包在另一個 class 或是 寫成User Control)
下圖就是最麻煩 坎尼已經想睡了不太想講的部分
好啦 還是解說一下 (大家可以點圖放大 看一下程式在幹嘛)
首先 把傳入的 object 轉為 Gridview
再將 Gridview 的 PagerRow裡的 Controls 取出做處理
顯示全部筆數 目前先給 pageCount * pageSize (當然 這邊是不準的 要再做其他處理)
顯示全部頁數 給 pageCount
接下來 取得跳頁用的 DropDownList 並重新給予 Item
「這樣不會每次 DataBound 就重覆的把 item 給加進去嗎?」
不會的 因為這邊是動態產生
所以只要 PostBack 下拉選單的 Items 就會被清空
因此才要再重新把項目給加回去
再來的就是判斷 LinkButton 是否作用
最後再把下拉選單設定為目前的頁數
其實這個函數最外層還要加個判斷 if(gv.PageCount > 1)
因為 GridView 預設 如果無分頁(頁數小於1) 則不顯示 PagerRow
這段程式碼就會因此出現 Exception
下面就是實際操作畫面
這篇真是又臭又長 希望有人有耐心看到這邊 XD
最後再提一個東西 DataPager
這是 .net framework 3.5 新增的控制項
目的也是在做分頁的顯示及控制
可惜目前只支援 ListView 控制項
若是想在 Gridview 上要自己做美美的分頁
還是只能靠自己寫分頁樣板及事
件
沒有留言:
張貼留言