Question

我正在使用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");             
             });
       }

Answer 1

你可以这样做：

定义table columns（定义你是否已经这样做），并使用表列定义的sClass属性（使用JSON）。

在此之后，该类将应用于表列。

在此之后，使用数据表的callback函数：fnRowCallback

并在此处将html设置为

$(nRow, '.your_class').html('Your HTML Values');

当表的每一行都被渲染时，将调用它。

如果您不希望它在每一行上执行，您可以使用if条件控制它。

Answer 2

在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'/>"
                 }
    }
]

如何更改dataTables中标题单元格的内容？

2 个答案: