Добавить гиперссылку к тексту в столбце, созданном с помощью bootstrap-table

Используя Node + Jade, я создаю таблицу, которая будет отображать большой список пользователей, поэтому я решил использовать bootstrap-table и нашел отличную библиотеку с множеством возможностей.

В настоящее время я использую разбиение на страницы, чтобы не отображать столько информации в таблице, таблица на данный момент имеет только два столбца, первый столбец - это флажок для выбора нескольких пользователей, а второй столбец - это просто имена пользователей. Таблица выглядит великолепно, но я бы добавил ссылку для подробного описания пользователя (пример: / user /: id) и добавил бы эту ссылку во второй столбец.

В настоящее время мой код выглядит так:

table(data-toggle='table', data-url='users.json', data-pagination='true', data-search='true', data-striped='true')
  thead
    tr
      th(data-checkbox='true')
      th(data-field='username') Username

Я просто хочу добавить гиперссылку к тексту, содержащему имя пользователя


bootstrap-table pug
person Rodrigo Moreno    schedule 27.05.2015    source источник

Ответы (2)


arrow_upward
5
arrow_downward

В вашей HTML-таблице:

<th data-field="user_name" data-formatter="LinkFormatter">Computer</th>

в вашем javascript:

function LinkFormatter(value, row, index) {
  return "<a href='/userid/id:"+row.id+"'>"+value+"</a>";
}
person William Weatherby    schedule 04.06.2015

arrow_upward
0
arrow_downward

HTML

<table id="table_exemple" data-toggle="table" data-pagination="true" >
    <thead>
        <tr>
            <th data-field="id">Id</th>
            <th data-field="name">Nome</th>
            <th data-field="action" data-formatter="ActionFormatter">Details</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

JAVASCRIPT

var bootstrap_table = $('#table_exemple');

function AddRow(obj){
    bootstrap_table.bootstrapTable('insertRow', {
        index: 0,
        row: {
           id: obj.id,
           name: obj.name,
           action: obj.id
        }
    });
}

function ActionFormatter(value) {
    return '<a href="javascript:void(0)" onclick="Details('+ value +')">Details</a>';
}

function Details(id){
    ...
}
person FelipeFalanque    schedule 13.09.2017