app/assets/javascripts/admin/category-order.js
$(function() {
$('.save-order').each(function(index){
// identify the elements that will work together
var save_button = $(this);
var save_notice = save_button.next();
var save_panel = save_button.parent();
var list_element = $(save_button.data('list-id'));
var endpoint = save_button.data('endpoint');
// on the first list change, show that there are unsaved changes
list_element.sortable({
update: function (event, ui) {
if (save_button.is('.disabled')){
save_button.removeClass("disabled");
save_notice.html(save_notice.data('unsaved-text'));
save_panel.effect('highlight', {}, 2000);
}
}
});
// on save, POST to endpoint
save_button.click(function(){
if (!save_button.is('.disabled')){
var data = list_element.sortable('serialize', {'attribute': 'data-id'});
var update_call = $.ajax({ data: data, type: 'POST', url: endpoint });
// on success, disable the save button again, and show success notice
update_call.done(function(msg) {
save_button.addClass('disabled');
save_panel.effect('highlight', {}, 2000);
save_notice.html(save_notice.data('success-text'));
})
// on failure, show error message
update_call.fail(function(jqXHR, msg) {
save_panel.effect('highlight', {'color': '#cc0000'}, 2000);
save_notice.html(save_notice.data('error-text') + jqXHR.responseText);
});
}
return false;
})
});
});