View on GitHub

表格行重新排序

Bootstrap Table 的行重新排序扩展。

依赖:tablednd v0.9

如果需要,可以包含 bootstrap-table-reorder-rows.css 文件以使用默认的拖拽类。

使用方法

<link rel="stylesheet" href="extensions/reorder-rows/bootstrap-table-reorder-rows.css">
<script src=".../jquery.tablednd.js"></script>
<script src="extensions/reorder-rows/bootstrap-table-reorder-rows.js"></script>

示例

行重新排序

选项

reorderableRows

  • 属性: data-reorderable-rows

  • 类型: Boolean

  • 详情:

    设置为 true 以允许重新排序功能。

  • 默认值: false

onAllowDrop

  • 属性: data-on-allow-drop

  • 类型: function

  • 详情:

    传递一个函数,该函数将在一行悬停在另一行上时调用。如果函数返回 true,则允许放置在该行上,否则不允许。该函数接受 4 个参数:

    • 被拖拽行的数据
    • 光标下行的数据
    • 被拖拽的行
    • 光标下的行

    它返回一个布尔值:true 允许放置,false 不允许放置。

  • 默认值: null

onDragStop

  • 属性: data-on-drag-stop

  • 类型: function

  • 详情:

    传递一个函数,该函数将在用户停止拖拽时调用,无论行是否已重新排列。该函数接受 3 个参数:表格、行数据和用户正在拖拽的行。

  • 默认值: null

onDragStyle

  • 属性: data-on-drag-style

  • 类型: String

  • 详情:

    这是拖拽期间分配给行的样式。与行关联的样式有一些限制(例如,你不能很好地分配边框,即使可以,也不会显示)。

  • 默认值: null

onDragClass

  • 属性: data-on-drag-class

  • 类型: String

  • 详情:

    这个类在拖拽期间被添加,并在行被放置时移除。比使用 onDragStyle 更灵活,因为它可以被行单元格和其他内容继承。

  • 默认值: reorder-rows-on-drag-class

onDropStyle

  • 属性: data-on-drop-style

  • 类型: String

  • 详情:

    这是行被放置时分配的样式。与 onDragStyle 一样,你可以做的事情有限。此外,这会替换原始样式,所以再次考虑使用 onDragClass,它只是简单地添加然后在放置时移除。

  • 默认值: null

onReorderRowsDrag

  • 属性: data-on-reorder-rows-drag

  • 类型: Function

  • 详情:

    传递一个函数,该函数将在用户开始拖拽时调用。该函数接受 1 个参数:用户开始拖拽的行。

  • 默认值: 空函数

onReorderRowsDrop

  • 属性: data-on-reorder-rows-drop

  • 类型: Function

  • 详情:

    传递一个函数,该函数将在行被放置时调用。该函数接受 1 个参数:被放置的行。

  • 默认值: 空函数

dragHandle

  • 属性: data-drag-handle

  • 类型: String

  • 详情:

    这是光标元素。

    注意:此选项主要用于适配 TableDnD 插件。在没有特殊情况下,请不要修改默认值。

  • 默认值: >tbody>tr>td:not(.bs-checkbox)

useRowAttrFunc

  • 属性: data-use-row-attr-func

  • 类型: Boolean

  • 详情:

    如果你的 tr 元素没有 id 属性,则必须使用此函数。如果 tr 元素没有 id 属性,此插件将不会触发 onDrop 事件。

  • 默认值: false

事件

onReorderRow(重新排序行.bs.table)

当行被放置时触发,接收两个参数:

  • The new table data
  • The dropped row
  • The row of the old position