diff options
-rw-r--r-- | tests/unit/sortable/sortable.html | 3 | ||||
-rw-r--r-- | tests/unit/sortable/sortable_options.js | 38 | ||||
-rw-r--r-- | ui/jquery.ui.sortable.js | 11 |
3 files changed, 34 insertions, 18 deletions
diff --git a/tests/unit/sortable/sortable.html b/tests/unit/sortable/sortable.html index 7db14d482..8e0bac501 100644 --- a/tests/unit/sortable/sortable.html +++ b/tests/unit/sortable/sortable.html @@ -44,6 +44,9 @@ border-width: 0; height:19px; } + #sortable-table { + width: 100%; + } </style> </head> <body> diff --git a/tests/unit/sortable/sortable_options.js b/tests/unit/sortable/sortable_options.js index f0185b078..f2beb4dbc 100644 --- a/tests/unit/sortable/sortable_options.js +++ b/tests/unit/sortable/sortable_options.js @@ -359,19 +359,31 @@ test( "{ placeholder: String }", function() { }); test( "{ placholder: String } tr", function() { - expect( 3 ); - - var element = $( "#sortable-table tbody" ).sortable({ - placeholder: "test", - start: function( event, ui ) { - ok( ui.placeholder.hasClass( "test" ), "placeholder has class" ); - equal( ui.placeholder.children().length, 1, "placeholder tr contains a td" ); - equal( ui.placeholder.children().html(), $( "<span> </span>" ).html(), - "placeholder td has content for forced dimensions" ); - } - }); - - element.find( "tr" ).eq( 0 ).simulate( "drag", { + expect( 4 ); + + var originalWidths, + element = $( "#sortable-table tbody" ).sortable({ + placeholder: "test", + start: function( event, ui ) { + var currentWidths = otherRow.children().map(function() { + return $( this ).width(); + }).get(); + ok( ui.placeholder.hasClass( "test" ), "placeholder has class" ); + deepEqual( currentWidths, originalWidths, "table cells maintian size" ); + equal( ui.placeholder.children().length, dragRow.children().length, + "placeholder has correct number of cells" ); + equal( ui.placeholder.children().html(), $( "<span> </span>" ).html(), + "placeholder td has content for forced dimensions" ); + } + }), + rows = element.children( "tr" ), + dragRow = rows.eq( 0 ), + otherRow = rows.eq( 1 ); + + originalWidths = otherRow.children().map(function() { + return $( this ).width(); + }).get(); + dragRow.simulate( "drag", { dy: 1 }); }); diff --git a/ui/jquery.ui.sortable.js b/ui/jquery.ui.sortable.js index d16407216..7b145159e 100644 --- a/ui/jquery.ui.sortable.js +++ b/ui/jquery.ui.sortable.js @@ -752,15 +752,16 @@ $.widget("ui.sortable", $.ui.mouse, { element: function() { var nodeName = that.currentItem[0].nodeName.toLowerCase(), - element = $( that.document[0].createElement( nodeName ) ) + element = $( "<" + nodeName + ">", that.document[0] ) .addClass(className || that.currentItem[0].className+" ui-sortable-placeholder") .removeClass("ui-sortable-helper"); if ( nodeName === "tr" ) { - // Use a high colspan to force the td to expand the full - // width of the table (browsers are smart enough to - // handle this properly) - element.append( "<td colspan='99'> </td>" ); + that.currentItem.children().each(function() { + $( "<td> </td>", that.document[0] ) + .attr( "colspan", $( this ).attr( "colspan" ) || 1 ) + .appendTo( element ); + }); } else if ( nodeName === "img" ) { element.attr( "src", that.currentItem.attr( "src" ) ); } |