Vedi su GitHub

Bootstrap Table Editable

Estensione Editable per Bootstrap Table.

In questa pagina

Utilizza il plugin: x-editable

Utilizzo

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

Opzioni

editable

  • Attributo: data-editable

  • Tipo: Boolean

  • Dettagli:

    Imposta false per disabilitare l’editabilità di tutte le colonne.

  • Default: true

Opzioni delle colonne

alwaysUseFormatter

  • Attributo: data-always-use-formatter

  • Tipo: Boolean

  • Dettagli:

    Imposta true per utilizzare sempre il formatter, anche se la colonna è già stata modificata.

  • Default: false

editable

  • Attributo: data-editable

  • Tipo: Object | Function

  • Dettagli:

    Configurazione di x-editable. Elenco completo delle opzioni: http://vitalets.github.io/x-editable/docs.html#editable.

    Se è di tipo Function, viene chiamato con i parametri: index, row, element per ciascuna riga della tabella. Dovrebbe restituire l’oggetto di configurazione di x-editable.

    Tutte le opzioni possono essere definite tramite attributi HTML data-editable-*. Le opzioni a livello di tabella vengono utilizzate per ogni colonna ma possono essere sovrascritte:

    <table id="my_table_id"
      data-url="data/url.json"
      data-id-field="id"
      data-editable-emptytext="Testo vuoto predefinito."
      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">Nome</th>
          <th class="col-md-7" data-field="description" data-editable="true" data-editable-emptytext="Testo vuoto personalizzato.">Descrizione</th>
        </tr>
      </thead>
    </table>

    Puoi utilizzare noEditFormatter per disabilitare la colonna editabile, ad esempio:

    {
      editable: {
        noEditFormatter (value, row, index) {
          if (value === 'noEdit') {
            return 'Non modificabile'
          }
          return false
        }
      }
    }
  • Default: undefined

Eventi

onEditableInit(editable-init.bs.table)

Si attiva quando tutte le colonne sono state inizializzate dal metodo $().editable().

onEditableSave(editable-save.bs.table)

Si attiva quando una cella editabile viene salvata.

Parametri: field, row, rowIndex, oldValue, $el

onEditableShown(editable-shown.bs.table)

Si attiva quando una cella editabile viene aperta per le modifiche.

Parametri: field, row, $el

onEditableHidden(editable-hidden.bs.table)

Si attiva quando una cella editabile viene nascosta/chiusa.

Parametri: field, row, $el, reason

Problemi esistenti

  • L’estensione editable non supporta la funzionalità di ricerca nel tipo select.