如何在使用wenzhixin bootstrap表服务器端分页时向td元素添加类或属性

Question

我正在使用wenzhixin bootstrap表与服务器端分页。我的表有两个特殊列（第一列用于行Guid行id，第二列包括每个单元格的两个按钮）

我的问题是，我应该隐藏第一列内容，因为我不希望用户看到所有Guid id。而且，我的表数据随服务器端分页而来。我无法用第二列的html代码按钮。

如何为服务器端分页添加自定义列，或者如何向第一列或第二列中的所有单元格添加属性？

Answer 1

要隐藏列，您可以在bootstrapTable('load',..)之后使用JavaScript命令（如果您使用它），或者在文档就绪块中使用：

$table.bootstrapTable('hideColumn', 'name')

在Bootstrap-Table网站上显示：bootstrap-table.com: showColumn-hideCoulumn

或者如果在表格中定义，则将data-visible =“false”添加到要隐藏的列中。 bootstrap-table.com: column-options visible即

<table id="table"
  data-toggle="table"... >
<thead>
    <tr>
        <th data-field="id" data-visible="false" >ID</th>

对于按钮 - 我不确定这是什么类型的项目 - 但我通过数据格式化器向表行添加链接按钮解决了这个问题 - 在API文档bootstrap-table.com/docs/api/column-options/#formatter上阅读

我使用了github.com/wenzhixin/bootstrap-table/issues/1765上的示例 - 格式 - >'基本格式' - 它显示了如何添加链接（按钮通过Bootstrap CSS）。要使链接特定于某一行，请使用row []获取字段值，或者您甚至可以使用id列而不是隐藏它，如果这是您的字段（使用'value'而不是row []然后 - 请参阅例子）。我做了类似的事情：

<th data-formatter="buttonFormatter">View Links</th>

然后在javascript <script>块：

function buttonFormatter(value, row, index) {
    var id= row["id"];
    var url = "https:/...&id=" + id;
    return '<a href="'+ url + '" class="btn btn-primary">View</a>';
}

这些大致基于我最近一直在做的事情 - 没有测试这些例子，但如果你还没有弄清楚它应该给你一个良好的开端......