DWZ table的原生分頁淺談_jquery

最近在專案開發當中很少會用到DWZ原生的table分頁，往往是使用jqgrid or grid這種第三方資料綁定的表格插件，如今在專案中要求了，就必須要使用DWZ自帶的table了

接下來看一段程式碼，我會給大家詳細介紹DWZ中table分頁的使用方式，以下是在MVC中實現的方式。

?

currentPage="@ViewBag.currentPage ">

 屬性介紹

targetType:綁定方式，DWZ這裡提供了"navTab" and "dialog"這兩種方式，顧名思義就是分頁是在標籤頁上還是彈出層上

totalCount:資料總行數

numPerPage:目前頁資料行數

pageNumShown:總頁數

currentPage:目前頁碼

複製程式碼 程式碼如下:

@using (Html.BeginForm("BidjList," TbUnify", null, FormMethod.Post, new { id = "pagerForm" }))
{
      
}

注意DWZ下分頁的表單必須加上id="pagerForm"屬性，否則不會執行。 DWZ中表格的分頁實質是將分頁的方式以表單提交的形式傳遞至後台，由後台接收參數，獲取分頁資訊：例如：

複製程式碼 程式碼如下:

Request.Form["numPerage"]

取得分頁資訊表單的值就是你在View中pagerForm表單下定義隱藏文字網域的name，在後台接收後去請求資料來源中分頁後的數據，再回傳至前台。

而這裡存在一個小問題：第一次進入此頁面時，是無法觸發當前分頁的的表單提交事件的，所以在上面我定義了ViewBag.numPerPage動態賦值，每頁分取多少條數據，前台界面只是將分頁樣式定義，實質資料沒有綁定，所以必須要將前台傳遞過來的分頁資訊作為後台資料分頁的依據，這樣前台的分頁才能與資料對接一致，不會造成錯亂，這點要注意。

在實際專案的開發當中，我們總是會把表格與篩選條件放在一起，DWZ中表格傳入限制條件的方式也很簡單，如上在分頁表單上加入需要傳入的隱藏文字域例如：

複製程式碼 代碼如下:

這樣在後台就能夠接受到傳入的過濾條件了。
DWZ 的table分頁實質是將當前標籤頁的資料reload，致使標籤頁刷新，若限制條件與分頁共同使用時，這樣就會存在一個問題，頁面reload後會使你的過濾條件丟失，而這裡我解決的方法還是在分頁的表單中加入隱藏文字域，每次把過濾條件賦值，在後台判斷是否為空，是否加入過濾條件，希望大家能夠注意這點。

最後再說一點，在上面介紹了targetType，表示當前分頁的方式與分頁實質是標籤頁的刷新，所以如果我們把包含table的View層作為部分頁用異步去進行加載時，就會發現， DWZ的分頁控制項是不會顯示的，也就無法分頁，在上面已經告訴大家每次分頁是要指定type的，如果使用$.load或@Html.Partial都是只能載入出第一頁的數據，這也是DWZ中存在缺陷的地方吧，畢竟DWZ的興起也是近年，還是存在很多問題與BUG的，尤其是他的table分頁與數據綁定真心不好用，但是總體來說，DWZ其他組件與樣式還是很不錯的。

好了關於DWZ table分頁今天就介紹到這裡。