Table Editable

Расширение встроенного редактирования для Bootstrap Table, поддерживает функцию редактирования ячеек.

На этой странице

Расширение встроенного редактирования основано на плагине x-editable и добавляет в таблицу функцию встроенного редактирования, позволяя пользователям редактировать ячейки напрямую нажатием.

Использование

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

Опции

editable

Атрибут: data-editable
Тип: Boolean
Описание:

Глобально управляет включением функции редактирования. При установке в false отключает функцию редактирования для всех столбцов; при установке в true включает функцию редактирования (требуется отдельная настройка столбцов).
Значение по умолчанию: true

Опции столбцов

alwaysUseFormatter

Атрибут: data-always-use-formatter
Тип: Boolean
Описание:

При установке в true, даже если этот столбец уже был отредактирован, всегда используется formatter.
Значение по умолчанию: false

editable

Атрибут: data-editable
Тип: Object | Function
Описание:

Параметры конфигурации x-editable. Полную конфигурацию см.: http://vitalets.github.io/x-editable/docs.html#editable.

Если это функция, она вызывается для каждой строки таблицы, параметры: index, row, element, должна возвращать объект конфигурации x-editable.

Все опции могут быть определены через HTML-атрибуты data-editable-*. Опции уровня таблицы применяются ко всем столбцам, могут быть переопределены на уровне столбцов:
```
<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>
```
Можно использовать noEditFormatter, чтобы сделать некоторые значения нередактируемыми, например:
```
{
  editable: {
    noEditFormatter (value, row, index) {
      if (value === 'noEdit') {
        return 'No Edit'
      }
      return false
    }
  }
}
```
Значение по умолчанию: 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

Известные проблемы

Расширение Table Editable не поддерживает поиск в режиме select.