[英]how to change the content of a header cell in dataTables?
我正在使用dataTables插件
在我的可排序列上,我想用一個按鈕替換列文本。
但是這樣做:
$( oSettings.aoColumns[i].nTh).text();
我可以檢索相應列的文本,但是
$( oSettings.aoColumns[i].nTh).text("some text");
$( oSettings.aoColumns[i].nTh).html("<a href='#'>some button</a>");
什么都不做。
有人可以告訴我為什么我可以從單元格中檢索信息但不能編輯它的內容嗎? 不一定是dataTables的問題,但也許有人遇到過類似的問題。
感謝幫助!
編輯:這是解決方案:
在表調用中指定哪些列應該是可排序的=這些是獲取.jqmSorter類
"aoColumns": [
/* Select */ {"bSortable": false },
/* Type */ {"sClass": "jqmSorter"},
/* From */ {"bSortable": false },
/* Status */ {"bSortable": false },
],
然后調用fnHeaderCallback ,其中我用JQM按鈕替換標題單元格內容:
"fnHeaderCallback": function( nHead ) {
$(nHead).closest('thead').find('.jqmSorter').each( function () {
var sortTitle = $(this).text(),
sortButton =
$( document.createElement( "a" ) ).buttonMarkup({
shadow: false,
corners: false,
theme: 'a',
iconpos: "right",
icon: "ui-icon-radio-off"
})
sortButton.find('.ui-btn-text').text(sortTitle);
$(this).html( sortButton )
sortButton.addClass("colHighTrigger");
});
}
你可以這樣做:
在定義table columns
(定義您是否已經執行此操作),並使用表列定義的sClass
屬性(使用JSON)。
在此之后,該類將應用於表列。
在此之后,使用datatables的callback
函數: fnRowCallback
並在此,將html設置為
$(nRow, '.your_class').html('Your HTML Values');
這將在呈現表的每一行時調用。
如果您不希望它在每一行上執行,您可以使用if條件控制它。
使用fnRender
在aoColumns
設置,使用它返回的HTML代碼,你想將工作有特定的細胞,下拉菜單,復選框,任何東西。
"aoColumns": [
/*Col 1*/
{
"mData": "RowID",
"bSortable": false,
"sClass": "jqmSorter",
"fnRender": function(obj){
return "<input id='" + obj.aData.RowID + "' type='button' value='myval'/>"
}
},
/*Col 2*/
{
"bSortable": false,
"sClass": "jqmSorter",
"fnRender": function(obj){
return "<input id='" + obj.aData.RowID + "' type='button' value='myval'/>"
}
}
]
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.