轉換 1.10 的參數名稱
DataTables 1.10 導入了使用駝峰式命名法,而非 v1.9 及更早版本所使用的舊匈牙利命名法。 新的 API 也遵循此新的命名規則。
此變更為完全向後相容,您可以繼續像以前一樣使用舊版本的參數名稱和 API 方法。但是,如果您希望將參數和 API 方法的使用方式更新為新的方式,請使用下表來對應兩種參數名稱形式。它們大多數都是從匈牙利命名法到駝峰式命名法的直接轉換,但為了命名一致性,一些參數也在新選項和 API 中被重新命名。
初始化
現在可以使用以下方式建立 DataTable:
$(...).dataTable()
- 建立一個 DataTable 並傳回一個 jQuery 物件(這是 1.9 的樣式)$(...).DataTable()
- 建立一個 DataTable 並傳回一個新的 DataTables API 實例
這兩種方法都可在 DataTables 1.10+ 中使用。
選項
匈牙利命名法 | 駝峰式命名法 | 意義 |
---|---|---|
aaData |
data |
用作表格顯示資料的資料。 |
aaSorting |
order |
要套用到表格的初始順序(排序) |
aaSortingFixed |
orderFixed |
始終套用到表格的排序 |
aDataSort |
columns.orderData |
將多個資料行排序定義為資料行的預設排序 |
aLengthMenu |
lengthMenu |
變更頁面長度 select 清單中的選項。 |
aTargets |
columnDefs.targets |
指定資料行定義應套用的資料行。 |
aoColumns |
columns |
資料行設定陣列。 |
aoColumnDefs |
columnDefs |
資料行定義設定陣列。 |
aoSearchCols |
searchCols |
定義個別資料行的初始搜尋。 |
asSorting |
columns.orderSequence |
排序方向應用順序 |
asStripeClasses |
stripeClasses |
設定表格中列的斑馬條紋類別名稱。 |
bAutoWidth |
autoWidth |
功能控制 DataTables 的智慧型資料行寬度處理 |
bDeferRender |
deferRender |
功能控制延遲呈現以加快初始化速度。 |
bDestroy |
destroy |
銷毀任何與選擇器匹配的現有表格,並以新選項取代。 |
bFilter |
searching |
功能控制搜尋(篩選)功能 |
bInfo |
info |
功能控制表格資訊顯示欄位 |
bJQueryUI |
jQueryUI |
使用表格的標記和類別,以便由 jQuery UI ThemeRoller 設定主題。 |
bLengthChange |
lengthChange |
功能控制終端使用者變更表格分頁顯示長度的能力。 |
bPaginate |
paging |
啟用或停用表格分頁。 |
bProcessing |
processing |
功能控制處理指示器。 |
bRetrieve |
retrieve |
擷取現有的 DataTables 實例 |
bScrollAutoCss |
已移除 | |
bScrollCollapse |
scrollCollapse |
允許表格在顯示有限數量的列時縮減高度。 |
bScrollInfinite |
已移除 | |
bSearchable |
columns.searchable |
啟用或停用此資料行中資料的篩選 |
bServerSide |
serverSide |
功能控制 DataTables 的伺服器端處理模式。 |
bSort |
ordering |
功能控制 DataTables 中的排序功能。 |
bSortable |
columns.orderable |
啟用或停用此資料行的排序 |
bSortCellsTop |
orderCellsTop |
控制將排序事件處理常式套用到資料行中的哪個儲存格 |
bSortClasses |
orderClasses |
反白顯示表格主體中正在排序的資料行 |
bStateSave |
stateSave |
狀態儲存 - 在頁面重新載入時還原表格狀態 |
bUseRendered |
已移除 | 使用 columns.render |
bVisible |
columns.visible |
啟用或停用此資料行的顯示 |
fnCookieCallback |
已移除 | |
fnCreatedCell |
columns.createdCell |
儲存格建立回呼以允許 DOM 操作 |
fnCreatedRow |
createdRow |
每次為表格主體建立 TR 元素時的回呼。 |
fnDrawCallback |
drawCallback |
每次 DataTables 執行繪製時都會呼叫的函式。 |
fnFooterCallback |
footerCallback |
頁尾顯示回呼函式。 |
fnFormatNumber |
formatNumber |
數字格式化回呼函式。 |
fnHeaderCallback |
headerCallback |
頁首顯示回呼函式。 |
fnInfoCallback |
infoCallback |
表格摘要資訊顯示回呼。 |
fnInitComplete |
initComplete |
初始化完成回呼。 |
fnPreDrawCallback |
preDrawCallback |
繪製前回呼。 |
fnRender |
已移除 | 使用 columns.render |
fnRowCallback |
rowCallback |
列繪製回呼。 |
fnServerData |
ajax |
從 Ajax 來源載入表格內容的資料 |
fnServerParams |
ajax |
從 Ajax 來源載入表格內容的資料 |
fnStateLoad |
stateLoadCallback |
定義應在何處以及如何載入已儲存狀態的回呼 |
fnStateLoaded |
stateLoaded |
狀態載入回呼。 |
fnStateLoadParams |
stateLoadParams |
狀態載入 - 資料操作回呼 |
fnStateSave |
stateSaveCallback |
定義如何儲存和在何處儲存表格狀態的回呼 |
fnStateSaveParams |
stateSaveParams |
狀態儲存 - 資料操作回呼 |
iCookieDuration |
stateDuration |
已儲存狀態的有效期限 |
iDataSort |
columns.orderData |
將多個資料行排序定義為資料行的預設排序 |
iDeferLoading |
deferLoading |
延遲伺服器端資料的載入,直到第二次繪製 |
iDisplayLength |
pageLength |
變更初始頁面長度(每頁的列數) |
iDisplayStart |
displayStart |
初始分頁起點 |
iScrollLoadGap |
已移除 | |
iTabIndex |
tabIndex |
用於鍵盤導覽的索引標籤控制項 |
mData |
columns.data |
從列資料物件/陣列設定資料行的資料來源 |
mRender |
columns.render |
呈現(處理)資料,以用於表格中 |
oLanguage .oAria.sSortAscending |
language.aria.sortAscending |
用於 WAI-ARIA 特定屬性的語言字串 |
oLanguage .oAria.sSortDescending |
language.aria.sortDescending |
用於 WAI-ARIA 特定屬性的語言字串 |
oLanguage .oPaginate.sFirst |
language.paginate.first |
分頁「第一頁」按鈕字串 |
oLanguage .oPaginate.sLast |
language.paginate.last |
分頁「最後一頁」按鈕字串 |
oLanguage .oPaginate.sNext |
language.paginate.next |
分頁「下一頁」按鈕字串 |
oLanguage .oPaginate.sPrevious |
language.paginate.previous |
分頁「上一頁」按鈕字串 |
oLanguage .sEmptyTable |
language.emptyTable |
表格沒有記錄的字串 |
oLanguage .sInfo |
language.info |
表格摘要資訊顯示字串 |
oLanguage .sInfoEmpty |
language.infoEmpty |
當表格空白或沒有記錄時使用的表格摘要資訊字串 |
oLanguage .sInfoFiltered |
language.infoFiltered |
當表格被篩選時附加到摘要資訊的字串 |
oLanguage .sInfoPostFix |
language.infoPostFix |
附加到所有其他摘要資訊字串的字串 |
oLanguage .sInfoThousands |
language.thousands |
千位分隔符號 |
oLanguage .sLengthMenu |
language.lengthMenu |
頁面長度選項字串 |
oLanguage .sLoadingRecords |
language.loadingRecords |
載入資訊顯示字串 - 在 Ajax 載入資料時顯示 |
oLanguage .sProcessing |
language.processing |
處理指示器字串 |
oLanguage .sSearch |
language.search |
搜尋輸入字串 |
oLanguage .sUrl |
language.url |
從遠端檔案載入語言資訊 |
oLanguage .sZeroRecords |
language.zeroRecords |
篩選導致表格空白的字串 |
oSearch |
search |
在 DataTables 中設定初始篩選和/或篩選選項。 |
sAjaxDataProp |
ajax.dataSrc |
表格資料的資料屬性或操作方法 |
sAjaxSource |
ajax |
從 Ajax 來源載入表格內容的資料 |
sCellType |
columns.cellType |
要為資料行建立的儲存格類型 |
sClass |
columns.className |
要指派給資料行中每個儲存格的類別 |
sContentPadding |
contentPadding |
在計算表格的最佳寬度時,將內距新增至文字內容。 |
sCookiePrefix |
已移除 | |
sDefaultContent |
columns.defaultContent |
設定資料行的預設靜態內容 |
sDom |
dom |
定義要顯示在頁面上並按何種順序顯示的表格控制項元素 |
sName |
columns.name |
為資料行設定描述性名稱 |
sPaginationType |
pagingType |
分頁按鈕顯示選項 |
sScrollX |
scrollX |
水平捲動 |
sScrollXInner |
scrollXInner |
在 1.10 中未記錄 |
sScrollY |
scrollY |
垂直捲動 |
sServerMethod |
ajax |
從 Ajax 來源載入表格內容的資料 |
sSortDataType |
columns.orderDataType |
即時 DOM 排序類型指派 |
sTitle |
columns.title |
設定資料行標題 |
sType |
columns.type |
設定資料行類型 - 用於篩選和排序字串處理 |
sWidth |
columns.width |
資料行寬度指派 |
API
請注意,這是用於將舊 API 的使用方式轉換為新 API 的參考。新的 API 更為全面,並且有許多未在此處顯示的其他選項。請參閱 API 參考,以取得有關如何使用它的完整資訊。
匈牙利命名法 | 駝峰式命名法 | 意義 |
---|---|---|
$ |
$ |
對整個表格執行 jQuery 選擇動作。 |
_ |
row().data() 、 rows().data() 、 cell().data() |
從列、資料行或儲存格取得資料 |
fnAddData |
row.add() 、 rows.add() |
將一或多個新列新增至表格。 |
fnAdjustColumnSizing |
columns.adjust() |
重新計算資料行寬度 |
fnClearTable |
clear() |
清除表格的所有資料。 |
fnClose |
row().child.hide() |
隱藏父列的子列 |
fnDeleteRow |
row().remove() 、 rows().remove() |
從 DataTable 中刪除一或多個列。 |
fnDestroy |
destroy() |
銷毀目前上下文中所有 DataTables。 |
fnDraw |
draw() |
重新繪製表格。 |
fnFilter |
search() 、column().search() 、columns().search() |
在表格中搜尋資料。 |
fnGetData |
row().data() 、 rows().data() 、 cell().data() |
取得列、欄或儲存格的資料 |
fnGetNodes |
row().node() 、rows().nodes() 、cell().node() |
取得列、欄或儲存格的節點 |
fnGetPosition |
row().index() 、cell().index() |
取得選取的列、欄或儲存格的索引資訊 |
fnIsDataTable |
$.fn.dataTable.isDataTable() |
檢查表格節點是否為 DataTable |
fnIsOpen |
row().child.isShown() |
檢查父列的子列是否可見 |
fnOpen |
row().child() |
使父列的子列可見 |
fnPageChange |
page() |
取得/設定表格的目前頁面。 |
fnSetColumnVis |
column().visible() |
取得/設定單一選定欄的可見性。 |
fnSettings |
settings() |
取得表格的設定物件 |
fnSort |
order() 、column().order() |
依選定的欄排序表格。 |
fnSortListener |
order.listener() |
為給定的欄將排序監聽器新增至元素。 |
fnTables |
$.fn.dataTable.tables() |
取得頁面上所有的 DataTables |
fnUpdate |
row().data() 、cell().data() |
設定列或儲存格的資料 |
fnVersionCheck |
$.fn.dataTable.versionCheck() |
版本號碼相容性檢查函數< |