Brian Grinstead

I wrote an article, Make Table Rows Sortable Using jQuery UI Sortable on the Foliotek Development Blog about a problem that I ran into when trying to set up a basic sortable table using jQuery UI. The columns would collapse down once the dragging began.

This was fixed by adjusting the helper object for the sortable function. Check out the [article][] for all the details, but here is a sample of the code if you are just looking for the solution:

// Return a helper with preserved width of cells
var fixHelper = function(e, ui) {
	ui.children().each(function() {
		$(this).width($(this).width());
	});
	return ui;
};
 
$("#sort tbody").sortable({
	helper: fixHelper
}).disableSelection();

Tags: cell, development, html, javascript, jquery, jquery-ui, programming, sortable, table

This entry was posted on Thursday, July 30th, 2009 at 1:17 pm and is filed under All, Web Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.