Как добавить класс или атрибут к элементу td при использовании пажинации на стороне сервера таблицы начальной загрузки wenzhixin - PullRequest
Новая
       7

Как добавить класс или атрибут к элементу td при использовании пажинации на стороне сервера таблицы начальной загрузки wenzhixin

0 голосов
/ 16 января 2019

Я использую таблицу начальной загрузки wenzhixin с пагинацией на стороне сервера. В моей таблице есть два специальных столбца (первый столбец для идентификатора строки Guid строки, второй столбец содержит две кнопки для каждой ячейки)

Моя проблема в том, что я должен скрыть содержимое первого столбца, потому что я не хочу видеть все идентификаторы Guid пользователями. Более того, данные моей таблицы поступают с нумерацией страниц на стороне сервера. Мне не удалось нажать кнопку с HTML-кодом для второго столбца.

Как добавить пользовательский столбец для нумерации страниц на стороне сервера или как добавить атрибут ко всем ячейкам в первом или втором столбце?

1 Ответ

0 голосов
/ 27 февраля 2019

Чтобы скрыть столбец, вы можете использовать либо команду JavaScript после bootstrapTable('load',..), если вы ее использовали, либо в блоке готовности документа: 

$table.bootstrapTable('hideColumn', 'name')

показано на сайте Bootstrap-Table: bootstrap-table.com: showColumn-hideCoulumn

или, если вы определяете в таблице, добавьте data-visible = "false" в столбец, который вы хотите скрыть. bootstrap-table.com: видимые опции столбца т.е. 

<table id="table"
  data-toggle="table"... >
<thead>
    <tr>
        <th data-field="id" data-visible="false" >ID</th>

Для кнопок - я не уверен, для какого типа это проект, - но я решил это, добавив кнопки ссылок к строкам таблицы через data-formatter - прочитайте об этом в документации API bootstrap-table .com / документы / API / колонки-опции / # форматировщик

Я использовал примеры, найденные на github.com / wenzhixin / bootstrap-table / Issues / 1765 - в разделе Формат -> «Основной формат» - в котором показано, как добавить ссылку (кнопка с помощью Bootstrap CSS). ). Чтобы сделать ссылку специфичной для строки, используйте row [], чтобы получить значение поля, или вы можете даже использовать столбец id вместо того, чтобы скрывать его, если это ваше поле (используйте 'value' вместо row [] затем - см. Примеры). Я сделал что-то вроде: 

<th data-formatter="buttonFormatter">View Links</th>

затем в блоке javascript <script>: 

function buttonFormatter(value, row, index) {
    var id= row["id"];
    var url = "https:/...&id=" + id;
    return '<a href="'+ url + '" class="btn btn-primary">View</a>';
}

Они основаны примерно на том, что я делал недавно - я не тестировал эти примеры, но должен дать вам хорошее начало, если вы еще не поняли ...

...