VGTable
Динамические таблицы
Remote режим
Загрузка строк с сервера, серверная пагинация, сортировка, cache и режимы data/view/auto.
JSON-данные
VGTable показывает skeleton с сохранением геометрии, запрашивает текущую страницу и передаёт серверу page, per_page, sort, dir и responsemode. В endpoint находится 100 записей.
| ID | Название | Категория | Статус | Обновлено |
|---|
HTML
<table
class="vg-table vg-table-hovered"
data-vg-table
data-request-route="/api/table/remote"
data-request-responsemode="data"
data-loading-min-delay="500"
data-loading-skeleton-rows="5"
data-pagination-enable="true"
data-pagination-per-page="10"
data-pagination-show-per-page="true"
>
<thead>
<tr>
<th data-field="id" data-sort-type="number">ID</th>
<th data-field="name">Название</th>
<th data-field="category">Категория</th>
<th data-field="status">Статус</th>
<th data-field="updated" data-sort-type="date">Обновлено</th>
</tr>
</thead>
<tbody></tbody>
</table>
Готовая разметка строк
В режиме view сервер возвращает view.tbody. Поэтому в строках можно использовать badges, ссылки, кнопки и другую Blade-разметку без клиентского шаблонизатора. Повторный одинаковый запрос берётся из cache экземпляра.
| ID | Название | Категория | Статус | Обновлено |
|---|
HTML
<table
class="vg-table vg-table-striped vg-table-hovered"
data-vg-table
data-request-route="/api/table/remote"
data-request-responsemode="view"
data-request-viewpath="view.tbody"
data-loading-min-delay="500"
data-loading-skeleton-rows="5"
data-request-cache-enable="true"
data-request-cache-ttl="30000"
data-request-cache-max="30"
data-pagination-enable="true"
data-pagination-per-page="10"
>
<thead>...</thead>
<tbody></tbody>
</table>