如何将排序添加到 bootstrap-table 卡片视图/自定义视图？

Question

我正在尝试创建一种直接从卡片模式（在我的例子中是自定义模式）使用的排序。

我自己创建了按钮，但我找不到在不在 table 视图中时对字段调用排序的方法。就像过滤选项一样，我正在寻找类似的东西：

$("#bootstrapTable").bootstrapTable("sortBy", {
    sortAlgorithm: sorter }

例如here：如果切换到 table 视图（单击眼睛），则可以按 table header 按名称排序。但是在 card/custom 视图中，你不能。

如何让那里的按钮按名称排序？

Answer 1

我找到了解决这个问题的方法。

您可以使用$('#table').bootstrapTable("refreshOptions", {})更改排序选项，它会生效。

在上面的例子中你可以使用：

<button onclick="sorter()">
  Sort by name
</button>

<script>

  function sorter() {
    console.log("here")
    $("#table").bootstrapTable("refreshOptions", {
    sortName: "name",
    sortOrder: "desc",
  });
  }
</script>

当然，您可以修改它以根据您想要的任何列进行排序并更改顺序。

希望对未来在这里跌跌撞撞的人有所帮助

如何将排序添加到 bootstrap-table 卡片视图/自定义视图？

How to add sort to bootstrap-table card view / custom view?

javascript

html

bootstrap-table