Table 的编辑

Bootstrap Table可编辑表扩展名

使用插件: x-editable

用法

<script src="extensions/editable/bootstrap-table-editable.js"></script>

选项

editable

  • 类型: Boolean

  • 详情:

    将false设置为禁用可编辑所有列。

  • 默认: true

列选项

editable

  • 类型: Object | Function

  • 详情:

    配置x-editable。完整的选项列表:http://vitalets.github.io/x-editable/docs.html#editable.

    如果它是Function的类型,则使用params:index,row,table的每一行调用它。它应该返回x-editable配置的Object。

    所有选项都可以通过data-editable-*HTML属性定义。表格宽选项用于每列但可以覆盖:

  <table id="my_table_id"
    data-url="data/url.json"
    data-id-field="id"
    data-editable-emptytext="Default empty text."
    data-editable-url="/my/editable/update/path">
    <thead>
      <tr>
        <th class="col-md-1" data-field="id" data-sortable="true" data-align="center">#</th>
        <th class="col-md-4" data-field="name" data-editable="true">Name</th>
        <th class="col-md-7" data-field="description" data-editable="true" data-editable-emptytext="Custom empty text.">Description</th>
      </tr>
    </thead>
  </table>
  
  • 默认: undefined

活动

onEditableInit(editable-init.bs.table)

通过$().editable()方法初始化所有列时触发。

onEditableSave(editable-save.bs.table)

保存可编辑单元格时触发。

参数:field,row,rowIndex,oldValue,$ el

onEditableShown(editable-shown.bs.table)

打开可编辑单元格进行编辑时触发。

参数:field,row,$ el

onEditableHidden(editable-hidden.bs.table)

隐藏/关闭可编辑单元格时触发。

参数:field,row,$ el,reason

存在的问题

  • 可编辑扩展名不支持在选择类型中搜索。