2012-05-30 3 views
0

У меня есть таблица, которая динамически генерируется при нажатии на кнопку поиска следующим образом:сортировать все заголовки столбцов

puts "<table class=\"resultsTable\">" 
     puts "<tr><th colspan=\"10\" class=\"head\">Search Results</th></tr>" 
     puts "<tr>" 
     puts "<th></th>" 
     puts "<th>App</th>" 
     puts "<th>Name</th>" 
     puts "<th>Region</th>" 
     puts "<th>Market</th>" 
     puts "<th>Language</th>" 
     puts "<th>Function</th>" 
     puts "<th>LOB</th>" 
     puts "<th>Term</th>" 
     puts "<th>Call</th>" 
     puts "</tr>" 
     puts "<tr>" 
     puts "<td id=\"$cellID\">" 
     puts "<img src=\"images/magnifier.gif\" style=\"cursor:pointer\" onclick=\"showRouting({'spec':'${specific}', 'id':'${mkt_id}', 'name':'${mkt_name}', 'xfer':'${xfertype}', 'cell':'${cellID}'})\"</img>" 
     puts "</td>" 
     puts "<td>$level</td>" 
     puts "<td>$name</td>" 
     puts "<td>$reg_name</td>" 
     puts "<td>$link</td>" 
     puts "<td>$lang</td>" 
     puts "<td>$func</td>" 
     puts "<td>$lob</td>" 
     puts "<td>$term</td>" 
     puts "<td>$call</td>" 
     puts "</tr>" 

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

Что означает [0,0] [1,0]? Как бы я изменить мой код соответственно ?:

$(document).ready(function() 
    { 
     $("#myTable").tablesorter({sortList: [[0,0], [1,0]]}); 
    } 
); 
+1

Вам нужно будет использовать jquery или что-то еще. Twitter Bootstrap построил сортировку таблицы. Я бы предложил проверить это. –

+0

Как сказал бодд. Нет никакого способа сортировать таблицы без использования jQuery/JavaScript. –

ответ

2

Вы можете использовать http://datatables.net/ или http://tablesorter.com/docs/#Demo

Для настольного сортировщика создана как этот

// call the tablesorter plugin 
    $("table").tablesorter({ 
     // sort on the first column and third column, order asc 
     sortList: [[0,0],[2,0]] 
    }); 

где sortList: [[0,0],[2,0]] содержит индекс столбца (на основе 0) и порядок сортировки.

Таким образом, [[0,0],[2,0]] означает, что первый и третий столбцы будут сортироваться, и первоначально они будут отсортированы в порядке возрастания.

Проверьте это working fiddle, где параметры были учтены правильно.

И here имеет очень базовую версию, где все столбцы таблицы сортируются, но без графики, например. стрелки или фоны.

+0

Нужно ли мне загружать этот плагин и ссылаться на мой локальный путь или я могу ссылаться на внешний путь? Можете ли вы также рассказать мне, какой другой путь jquery мне понадобится? – newbie

+0

Я только что редактировал мой вопрос о tablesorter – newbie

+0

Лучше загрузить js на локальную машину и ссылку на них. Вы можете связать их с js для быстрой настройки, но это не хорошо. –

Смежные вопросы