CODEWITHSUNDEEP
jquery
user1048676
user1048676

Reputation: 10066

Drag a specific row into a new table with jQuery Sortable

I am trying to drag a specific row from one table into another table. I see the demo using LI and UL but I'm trying to do it with a table object. I created a JS fiddle to have my two different tables.

I tried different variations:

$( "#selected-stock-grid, #stock-grid" ).sortable({
  connectWith: ".table-stock-content"
}).disableSelection();

$( "#selected-stock-grid, #stock-grid" ).sortable({
  connectWith: ".table-stock-content tbody"
 }).disableSelection();

$( "#selected-stock-grid, #stock-grid" ).sortable({
  connectWith: ".table-stock-content tbody tr"
 }).disableSelection();

Here is a JS fiddle: https://jsfiddle.net/3f0u86gL/

It only tries to move the whole table instead of an individual row.

Upvotes: 1

Views: 374

Answers (1)

DaniP
DaniP

Reputation: 38252

You need to be more specific on your selectors, use the tbody element instead the whole table:

From the API

Note: In order to sort table rows, the tbody must be made sortable, not the table.

$(function() {
  $( "#selected-stock-grid tbody, #stock-grid tbody" ).sortable({
    connectWith: ".table-stock-content tbody"
  }).disableSelection();
});

Updated Demo

Upvotes: 1

Related Questions