HTML / Bootstrap Table Sorting и указатель направления сортировки

Question

Я использую загрузчик для отображения и сортировки таблицы.Мне было интересно, как / если бы я мог реализовать временную стрелку (или что-то) в каждом заголовке в таблице, чтобы указать, в каком направлении она сортируется.

Answer 1

РЕДАКТИРОВАТЬ: я предполагаю, что вы на самом деле хотите иконку для сортировки таблицы.

Это динамическое поведение, поэтому вы не сможете сделать это в чистом HTML / CSS: вам понадобитсяиспользовать JavaScript.Вот общие шаги, которые вы должны сделать, чтобы это произошло:

1. Сохраните все строки таблицы внутри переменной JavaScript
2. Внутри <th> поместите другой элемент,как <span> или <img>, который содержит ваше изображение стрелки.
3. Прикрепите обработчик щелчка к стрелке, который сортирует массив строк таблицы
4. После сортировки массива используйте DOMAPI-функции для удаления старой таблицы, создания новой таблицы и вставки новой таблицы вместо нее.Bootstrap обычно используется с jQuery, поэтому вы можете посмотреть на некоторые функции jQuery, чтобы удалить таблицу, построить новую (просматривая строки), а затем отобразить собранную таблицу на странице вместо старой.

Существует множество библиотек, которые делают это, но вы можете сделать это проще, сделав это самостоятельно.

Answer 2

Да, это возможно.Для заголовка добавьте следующее ...

<table>
    <thead>
         <tr>
             <th>Column 1 <span class="glyphicon glyphicon-sort"></th>
             ...
         </tr>
    </thead>
</table>