GridView + DataTables.js

一、純顯示用的GridView

由於DataTables使用上需要套在完整的table格式中, 使用GridView會沒有thead的部分，將無法套用。

這時請在後端你的Gridview DataBound區塊加入以下程式碼：

If (e.Row.RowTye = DataControlRowType.Header) Then

e.Row.TableSection = TableRowSection.TableHeader

End If

二、有控制項的Gridview

有控制項的GridView則不適用「一」的方法，由於控制項有Postback的問題，在Postback後，DataTables並不會再重新initiate一次，這時不要更改後端code，直接用前端JS加入thead。判斷方式如下

$(document).ready( function() {

bindDataTable();

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(bindDataTable);

})

Function bindDataTable() {

if (document.getElementById(”% YourGridViewID.ClientID %”).rows.length 1) { $(”#YourGridViewID”).prepend($(”thead/thead”).append($(”#YourGridViewID”).find(”tr:first”))).DataTable });

}

註：套用時記得要引用css & js喔。