Ответ 1
Здесь есть приличная запись в блоге:
был webtempest.com/sortable-list-in-ruby-on-rails-3-almost-unobtrusive-jquery/
По существу:
- В интерфейсе используется jQuery UI sortable, чтобы разрешить переупорядочивание элементов DOM перетаскивания мышью.
- Внутренний сервер использует acts_as_list для обработки обновления базы данных.
Оба они кажутся достаточно надежными, и я смог реализовать вариацию основных функциональных возможностей, описанных выше, с созданием нового элемента на одном экране и некоторыми колокольчиками и свистами CSS 3 (просто стиль .your-class.ui-sortable-helper
соответственно) без особых проблем, Я не тестировал широко в браузерах, но он выглядит счастливым в WebKit и Firefox.
Пример в блоге не очень сильно влияет на act_as_list - он просто сериализует идентификаторы объектов с помощью jQuery, а затем выполняет итерацию над ними в контроллере напрямую, но я думаю, что полезно иметь эти функции на задней панели, если вам нужно автоматизировать изменения оттуда по какой-то причине.
Key code из сообщения в блоге:
JavaScript:
$(document).ready(function(){
$('#books').sortable({
axis: 'y',
dropOnEmpty: false,
handle: '.handle',
cursor: 'crosshair',
items: 'li',
opacity: 0.4,
scroll: true,
update: function(){
$.ajax({
url: '/books/sort',
type: 'post',
data: $('#books').sortable('serialize'),
dataType: 'script',
complete: function(request){
$('#books').effect('highlight');
}
});
}
});
});
Вид:
<li id="book_<%= book.id %>">
Это включает идентификатор типа book_5
, который позволяет $('#books').sortable('serialize')
в Javascript создавать параметр запроса, который Rails может анализировать.
Контроллер:
def sort
@books = Book.all
@books.each do |book|
book.position = params['book'].index(book.id.to_s) + 1
book.save
end
Это может быть некорректно, в зависимости от того, как ваша модель контролируется/контролируется. В моем собственном решении я повторил вместо params['book']
и включил некоторую проверку/обработку ошибок, чтобы обеспечить принятие только значимых значений.
(P.S. это очень похоже на подход, которым Райан Бэйтс дает в своем, платный, видеозапись по той же теме.)
(P.P.S. Я знаю, что это старый вопрос, но, как это часто бывает с StackOverflow, Google достал меня сюда, поэтому я подумал, что буду документировать то, что я сделал.)