Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Using jQuery UI to add "drag and drop" reordering of items in the admin list view
/*
* @author http://djangosnippets.org/users/chrsgrrtt/
* @link Taken from http://djangosnippets.org/snippets/2160/
* @updated by Artur Barseghyan (fixed)
*
* Original readme:
* Using jQuery UI to add "drag and drop" reordering of items in the admin list view. The model must have an "order"
* field to store the order value in.
*
* Add the following to your model admin
* class Media: js = ['/media/js/path-to-jquery.js', '/media/js/path-to-jqueryui.js', '/media/js/sortable_list.js']
*/
$(function() {
// Matching regex with jQuery
$.expr[':'].regex = function(elem, index, match) {
var matchParams = match[3].split(','),
validLabels = /^(data|css):/,
attr = {
method: matchParams[0].match(validLabels) ?
matchParams[0].split(':')[0] : 'attr',
property: matchParams.shift().replace(validLabels,'')
},
regexFlags = 'ig',
regex = new RegExp(matchParams.join('').replace(/^\s+|\s+$/g,''), regexFlags);
return regex.test($(elem)[attr.method](attr.property));
}
$('table tbody tr').css({ 'cursor': 'move' });
$('table tbody').sortable({
axis: 'y',
update: function(){
$('.footer').show();
$.each($('table tbody tr'), function(i){
$(this).find('input:regex(name, .*-order)').val(i + 1);
});
$(this).find('tr').removeClass('row1').removeClass('row2');
$(this).find('tr:odd').addClass('row2');
$(this).find('tr:even').addClass('row1');
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.