mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
Sortable: Copy the cell structure when sorting a table row. Fixes #9185 - Sortable: Placeholder breaks table-layout: fixed.
(cherry picked from commit 09b3533910
)
This commit is contained in:
parent
83e0b4c6c8
commit
9711c54c6d
@ -44,6 +44,9 @@
|
|||||||
border-width: 0;
|
border-width: 0;
|
||||||
height:19px;
|
height:19px;
|
||||||
}
|
}
|
||||||
|
#sortable-table {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -359,19 +359,31 @@ test( "{ placeholder: String }", function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
test( "{ placholder: String } tr", function() {
|
test( "{ placholder: String } tr", function() {
|
||||||
expect( 3 );
|
expect( 4 );
|
||||||
|
|
||||||
var element = $( "#sortable-table tbody" ).sortable({
|
var originalWidths,
|
||||||
placeholder: "test",
|
element = $( "#sortable-table tbody" ).sortable({
|
||||||
start: function( event, ui ) {
|
placeholder: "test",
|
||||||
ok( ui.placeholder.hasClass( "test" ), "placeholder has class" );
|
start: function( event, ui ) {
|
||||||
equal( ui.placeholder.children().length, 1, "placeholder tr contains a td" );
|
var currentWidths = otherRow.children().map(function() {
|
||||||
equal( ui.placeholder.children().html(), $( "<span> </span>" ).html(),
|
return $( this ).width();
|
||||||
"placeholder td has content for forced dimensions" );
|
}).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 );
|
||||||
|
|
||||||
element.find( "tr" ).eq( 0 ).simulate( "drag", {
|
originalWidths = otherRow.children().map(function() {
|
||||||
|
return $( this ).width();
|
||||||
|
}).get();
|
||||||
|
dragRow.simulate( "drag", {
|
||||||
dy: 1
|
dy: 1
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
11
ui/jquery.ui.sortable.js
vendored
11
ui/jquery.ui.sortable.js
vendored
@ -763,15 +763,16 @@ $.widget("ui.sortable", $.ui.mouse, {
|
|||||||
element: function() {
|
element: function() {
|
||||||
|
|
||||||
var nodeName = that.currentItem[0].nodeName.toLowerCase(),
|
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")
|
.addClass(className || that.currentItem[0].className+" ui-sortable-placeholder")
|
||||||
.removeClass("ui-sortable-helper");
|
.removeClass("ui-sortable-helper");
|
||||||
|
|
||||||
if ( nodeName === "tr" ) {
|
if ( nodeName === "tr" ) {
|
||||||
// Use a high colspan to force the td to expand the full
|
that.currentItem.children().each(function() {
|
||||||
// width of the table (browsers are smart enough to
|
$( "<td> </td>", that.document[0] )
|
||||||
// handle this properly)
|
.attr( "colspan", $( this ).attr( "colspan" ) || 1 )
|
||||||
element.append( "<td colspan='99'> </td>" );
|
.appendTo( element );
|
||||||
|
});
|
||||||
} else if ( nodeName === "img" ) {
|
} else if ( nodeName === "img" ) {
|
||||||
element.attr( "src", that.currentItem.attr( "src" ) );
|
element.attr( "src", that.currentItem.attr( "src" ) );
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user