JQuery/Javascript, Переупорядочивающий строки
Вы можете использовать функцию enumerate, и это работает, потому что функция range является генератором, который возвращает редактирование tuple
for j,i in enumerate(range(1, 10)):
print("{}{}".format(j+1, "*"*i))
:
for i in range(1, 10):
print("{}{}".format(i, "*"*i))
# this is without the enumerate function
8 ответов
Просто сделайте что-то вроде этого:
Скажите, что у Вас есть таблица как так:
<table id='table'>
<tr id='row1'><td> .... </td></tr>
<tr id='row2'><td> .... </td></tr>
<tr id='row3'><td> .... </td></tr>
<tr id='row4'><td> .... </td></tr>
</table>
И массив с новым порядком как это:
NewOrder[1] = 3;
NewOrder[2] = 4;
NewOrder[3] = 2;
Затем сделайте некоторых что-то вроде этого (не протестированный, таким образом, Вы, возможно, должны настроить код, но это - идея):
for ( i=1; i<=NewOrder.length; i++ ) {
$('#row'+i).appendTo( '#table' );
}
Таким образом, они перемещены в конец таблицы в порядке.
Таким образом, у Вас будет 3 перемещенных в конец, затем 4 позади него, затем 2 позади этого, и т.д. После того, как они были ВСЕ добавлены в конец таблицы, первый станет первой строкой, и остальные будут в правильном порядке позади него.
Править:
Сделайте стиль таблицы ='display:none;' и затем сделайте $ ('#table') .show (); при запуске.
Отредактируйте Снова: Вы могли сделать отделение вокруг всего содержимого тела, как
<body>
<div id='everything' style='display:none;'>
....
</div>
</body>
Так, чтобы вся страница была скрыта (просто очищают белый) для части секунды, которую требуется, чтобы загрузить и заказать таблицу.
Затем Вы использовали бы:
$(function(){
$('#everything').show();
}
Показать всю страницу внезапно, как только DOM готов. Это возьмет часть секунды дольше для страницы для загрузки, но это все загрузится сразу, таким образом, не будет никакой флэш-памяти недостающих таблиц, и т.д., пока ВСЕ находится в #everything, будет просто похоже, что загруженная страница - должна быть очевидна для средства просмотра.
Проверьте Плагин jQuery TableSorter, очень мощно, что это обнаруживает базовые типы данных столбцов, и можно отсортировать столбцы таблицы программно:
$("#yourTable").tablesorter( {sortList: [[0,0]]} );
// This will sort "yourTable" using
// the first column, ascending [columnIndex, 0=ASC or 1 = DESC]
Почему бы не заказать строки на стороне сервера? Если Вы соберетесь переупорядочить их с JQuery, как только страница загружается затем, будет более эффективно сделать это задание в серверном коде, особенно если выбранный порядок пользователя будет сохранен в базе данных.
Рабочий пример. Просто выполните итерации через список, содержащий новый порядок (который, по-видимому, Вы читаете из DB), создавая новую таблицу. Затем установите HTML таблицы () к новому HTML таблицы.
<html>
<head>
<script type="text/javascript"
src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
jQuery.fn.outer = function(){
return $( $('<div></div>').html(this.clone()) ).html();
}
$(function(){
newtbl = "";
neworder = [2,3,1];
for(i=0;i<neworder.length;i++){
newtbl += $("#Row"+neworder[i]).outer();
}
$("#tbl").html("<table id=\"tbl\">" + newtbl + "</table>")
});
</script>
</head>
<body>
<table id="tbl">
<tr id="Row1">
<td>label 1</td>
<td>Some complex control</td>
</tr>
<tr id="Row2">
<td>label 2</td>
<td>Some complex control</td>
</tr>
<tr id="Row3">
<td>label 3</td>
<td>Some complex control</td>
</tr>
</table>
</body>
</html>
Следует иметь в виду, что reording клиентские листы сами открываются к проблемам тремя способами.
- Если клиентский компьютер является медленным, это переупорядочение может быть видимо независимо от того, что Вы делаете.
- Чем больше таблица данных становится, тем медленнее это действие будет и более видимое, переупорядочение было бы.
- У клиента мог быть отключенный JS, который повредит Ваше переупорядочение.
Хотя кажется, что Вы хотите сделать это клиентское для сохранения себя некоторые головные боли теперь на программировании серверной стороны, в конечном счете инвестируя некоторое время на этом теперь для получения его, серверная сторона избежит этих проблем.
Если у Вас есть проблемы, заставляющие серверный код работать правильно с Вашими пользовательскими элементами управления, отправляют его, и мы выручим Вас.
Попробуйте jQuery tablesorter плагин.
Когда загрузки документа, на которых можно отсортировать таблицу путем определения индекса столбца к виду (и это позволяет сортировать по нескольким столбцам):
$(document).ready(function()
{
$("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} );
}
);
Если последняя сортировка, сделанная пользователем, хранится как список, содержащий идентификатор строки, Вы могли сделать это:
loop through list from db {
$("#"+rowId).appendTo("#tableId")
}
Таким образом, строки будут вынуты из своего текущего местоположения и заменены в таблице в порядке, они хранятся в базе данных.
ОТРЕДАКТИРУЙТЕ appendTo работы метода. Однако в малой задержке реконструкции строк на стороне клиента, я вижу строки в их первоначальном заказе в течение приблизительно половины секунды, прежде чем переупорядочение будет завершено. Это поведение UI является более видным, так как страница не использует обратные передачи. Какое-либо обходное решение для этого?
Набор display:none на таблице с CSS. Когда документ готовые огни события используют appendTo метод. Действительно показывают на таблице. Можно установить другой тег style с display:block на таблице внутри <noscript> в случае, если js отключен.