Web Development with jQuery®

The preceding HTML fi le is combined with the same CSS you used in Example 13-2.css, and then
the following script is applied:
$(document).ready(
function()
{
var selectedFile;
$('li.finderCategoryFile').mousedown(
function()
{
if (selectedFile && selectedFile.length)
{
selectedFile.removeClass('finderCategoryFileSelected');
}
selectedFile = $(this);
selectedFile.addClass('finderCategoryFileSelected');
}
);
$('ul#finderCategoryFiles').sortable({
connectWith : 'ul#finderOtherCategoryFiles',
placeholder : 'finderCategoryFilePlaceholder',
opacity : 0.8,
cursor : 'move',
update : function(event, ui)
{
var data = $(this).sortable(
'serialize', {
attribute : 'data-path',
expression : /^(.*)$/,
key : 'categoryFiles[]'
}
);
data += '&categoryId=1';
alert(data);
// Here you could go on to make an AJAX request
// to save the sorted data on the server, which
// might look like this:
//
// $.get('/path/to/server/file.php', data);
}
});
[http://www.it-ebooks.info](http://www.it-ebooks.info)