مشاهده در GitHub

Bootstrap Table Editable

افزونه Editable برای Bootstrap Table.

در این صفحه

از پلاگین استفاده کنید: x-editable

استفاده

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

گزینه‌ها

editable

  • ویژگی: data-editable

  • نوع: Boolean

  • جزئیات:

    برای غیرفعال کردن قابلیت ویرایش تمام ستون‌ها، false تنظیم کنید.

  • پیش‌فرض: true

گزینه‌های ستون

alwaysUseFormatter

  • ویژگی: data-always-use-formatter

  • نوع: Boolean

  • جزئیات:

    برای استفاده همیشه از formatter، حتی اگر ستون قبلاً ویرایش شده باشد، true تنظیم کنید.

  • پیش‌فرض: false

editable

  • ویژگی: data-editable

  • نوع: Object | Function

  • جزئیات:

    پیکربندی x-editable. لیست کامل گزینه‌ها: http://vitalets.github.io/x-editable/docs.html#editable.

    اگر نوع آن Function باشد، با پارامترهای: index، row، element برای هر ردیف جدول فراخوانی می‌شود. باید Object پیکربندی 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

مشکلات موجود

  • افزونه editable از قابلیت جستجو در نوع select پشتیبانی نمی‌کند.