مشاهده در GitHub

Bootstrap Table Reorder Rows

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

در این صفحه

وابستگی: tablednd v0.9

اگر می‌خواهید، می‌توانید فایل bootstrap-table-reorder-rows.css را برای استفاده از dragClass پیش‌فرض شامل کنید.

استفاده

<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>

مثال

Reorder Rows

گزینه‌ها

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 پارامتر می‌گیرد: ردیفی که کاربر شروع به کشیدن آن کرده است.

  • پیش‌فرض: empty function

onReorderRowsDrop

  • ویژگی: data-on-reorder-rows-drop

  • نوع: Function

  • جزئیات:

    تابعی را پاس بدهید که وقتی ردیف رها می‌شود، فراخوانی می‌شود. تابع 1 پارامتر می‌گیرد: ردیفی که رها شده است.

  • پیش‌فرض: empty function

dragHandle

  • ویژگی: data-drag-handle

  • نوع: String

  • جزئیات:

    این عنصر نشانگر موس است.

    توجه: این گزینه عمدتاً برای سازگاری با پلاگین TableDnD استفاده می‌شود. تحت شرایط خاصی، لطفاً مقدار پیش‌فرض را تغییر ندهید.

  • پیش‌فرض: >tbody>tr>td:not(.bs-checkbox)

useRowAttrFunc

  • ویژگی: data-use-row-attr-func

  • نوع: Boolean

  • جزئیات:

    این تابع باید در صورت عدم وجود ویژگی id در عناصر tr شما استفاده شود. اگر عناصر tr شما ویژگی id ندارند، این پلاگین رویداد onDrop را فعال نمی‌کند.

  • پیش‌فرض: false

رویدادها

onReorderRow(reorder-row.bs.table)

هنگامی که ردیف رها شد، فعال می‌شود، دو پارامتر دریافت می‌کند:

  • داده‌های جدول جدید
  • ردیف رها شده
  • ردیف موقعیت قدیمی