Есть список, хотелось бы в панели администрирования менять позицию отображения. То есть в базе есть колонка position
, в ней указано текущее положение текста. Видимо реализация на JavaScript или на JQuery. Видел подобное, по-моему, в e107, когда позицию вывода можно менять "на лету" или, к примеру, в ВК можно менять фотографии местами аналогично "на лету". Вопрос: как это сделать?
Список выводится соответственно циклом из базы.
-
а как это делалось раньше?? ведь раньше не было JQuery???– DemoriaN9 окт 2011 в 18:56
2 ответа
Самый быстрый способ это вставить спрятанные инпуты внутрь блоков и после их перетягивания вызывать функцию которая проходилась бы по ним и записывала значение позиции, примерно вот так
$(function() {
$( "#sortable" ).sortable({
placeholder: "ui-state-highlight",
start:function(){ return sortNumber = 1;},
stop: function(){
$('li input').each(function(){
$(this).val(sortNumber);
sortNumber++;
});
}
});
});
Когда функция стартует создаем переменную, которая будет записываться в инпуты и в каждой итерации увеличиваем ее на один. Вот хтмл код блока
<form action="" method="post">
<ul id="sortable">
<li class="ui-state-default">Item 1<input class="hidden" type="text" name="pos1" value="" /></li>
<li class="ui-state-default">Item 2<input class="hidden" type="text" name="pos2" value="" /></li>
<li class="ui-state-default">Item 3<input class="hidden" type="text" name="pos3" value="" /></li>
</ul>
<input type="submit" />
</form>
Отправляем все это на сервер и записываем в базу значения.
-
-
для функции перетягивания используется jqueyui, которые работают вместе с jquery, поэтому сама функция которая записывает значения в инпуты на jquery 7 окт 2011 в 8:49
http://wil-linssen.com/entry/jquery-sortable-lists-with-drag-drop-handle/ насколько я понял