In my django project I show a list of books in template. Book model has position field which I use to sort books.
I'm trying to sort this list by drag and drop list items but my next code dont work well. I use JQuery UI. It works in frontend but dont change position field`s value when user drag and drop list item. Can someone help me to improve my js and view code. I am comfused. I would be grateful for any help.
models.py:
class Book(models.Model):
title = models.CharField(max_length=200, help_text='Заголовок', blank=False)
position = models.IntegerField(help_text='Поле для сортировки', default=0, blank=True)
class Meta:
ordering = ['position', 'pk']
html:
<div id="books" class="list-group">
{% for book in books %}
<div class="panel panel-default list-group-item ui-state-default">
<div class="panel-body">{{ book.title }}</div>
</div>
{% endfor %}
</div>
urls.py:
url(r'^book/(?P<pk>\d+)/sorting/$',
BookSortingView.as_view(),
name='book_sorting')
JS:
$("#books").sortable({
update: function(event, ui) {
var information = $('#books').sortable('serialize');
$.ajax({
url: "???",
type: "post",
data: information
});
},
}).disableSelection();
views.py:
class BookSortingView(View):
@method_decorator(csrf_exempt)
def dispatch(self, request, *args, **kwargs):
return super(BookSortingView, self).dispatch(request, *args, **kwargs)
def post(self, request, pk, *args, **kwargs):
for index, pk in enumerate(request.POST.getlist('book[]')):
book = get_object_or_404(Book, pk=pk)
book.position = index
book.save()
return HttpResponse()