【问题标题】:dataTables temporarily disable sortingdataTables 暂时禁用排序
【发布时间】:2016-07-08 09:38:23
【问题描述】:

我有一个可排序的数据表,其中填充了数据,您可以在单击它时编辑数据。

点击前是这样的:

<input type='text' value='...' size=3 disabled>

点击时:

$('#table1 tbody').on( 'click', 'tr', function () 
{
    var olddata = "";
    olddata = table.cell( this, 3 ).data();
    table.cell( this, 3 ).data( "<input type='text' value='" + olddata + "' size=3 style='background-color:white'>" );
});

但是,当您单击一行时,它会改变位置,因为它现在还包含额外的 html 代码,如果这是活动的排序列,它会在底部或顶部结束。

我排序使用:

var columnSet = 
[
    ...
    {title: "Mycolumn", width:"1%", "type": "string"},
    ...
];

所以我的问题是,是否可以在单击一行时暂时禁用整个表格中的排序,然后在完成编辑时再次启用,或者根据值属性进行排序?

【问题讨论】:

  • 对于数据表,您需要提及特定列是否应该是可排序的。如果您不想对任何列进行排序,您可以将所有列设置为 false。属性名称是“aoColumns”。
  • 是的,但我希望能够对它们进行排序,而不是当用户单击编辑行时。
  • 很难改变数据表的排序行为,因为您必须重新初始化数据表。如果您使用引导程序,建议不要进行内联编辑并将用户重定向到不同的页面或使用引导程序模式来编辑行。

标签: javascript jquery html datatables


【解决方案1】:

好的,我设法用一个小技巧解决了这个问题

var columnSet = 
[
    ...
    {title: "Mycolumn", width:"1%", "type": "html"},
    ...
];

使用 type: html 会删除 "" 之间的所有内容,但这让我使用 dataTables 尝试对空单元格进行排序,因为

<input value="...">

只有“”之间的内容

我解决了这个问题:

olddata = $(table.cell( row, 5 ).data()).attr("value");
table.cell( row, 5 ).data( "<input type='text' value='" + olddata + "' size=25 style='background-color:white'><p hidden>" + olddata + "</p>" );

p 元素不会被看到,但 datatable 可以看到它并使用它进行排序,因此行不会改变位置!这个解决方案甚至比禁用排序更好,因为您现在仍然可以对表格进行排序

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-08-29
    • 1970-01-01
    • 2012-08-14
    • 1970-01-01
    • 1970-01-01
    • 2012-08-20
    • 1970-01-01
    • 2017-02-28
    相关资源
    最近更新 更多