Multiple rows drag and drop

Multiple rows drag and drop

Posted by: anandarajmpec on 18 October 2019, 4:02 pm EST

• 

  anandarajmpec

  • Post Options:
  • Link
    Copy

  Posted 18 October 2019, 4:02 pm EST

  I am currently evaluating wijmo grid and syncfusion grid for our requirements.

  Virtual scrolling, drag and drop are the two of our top requirements.

  Virtual scrolling works excellent with wijmo grid but i am struggling to implement row drag and drop feature

  On the other hand syncfusion virtual scrolling is buggy. But the drag and drop feature is good.

  I am trying to use the drag and drop feature similar to the following demo
  
  https://ej2.syncfusion.com/react/demos/#/material/grid/row-drag-drop

  Can you guys provide me a demo similar to the above link using wijmo grid? Especially the drag and drop of multiple rows - both inside the grid and outside the grid

  Let me know if you need any details

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 20 October 2019, 8:38 pm EST

  Hi,

  You could use the HTML5 drag/drop API to drag and drop rows inside the grid or outside the grid. Please refer to the sample below:

  https://stackblitz.com/edit/js-a9cyvu

  Let us know if you have any further queries.

  Regards,
  
  Ashwin

• 

  anandarajmpec

  • Post Options:
  • Link
    Copy

  Posted 22 October 2019, 3:11 am EST

  There are few things missing in the demo

  1. Drag and drop by clicking and dragging the cells
  2. An entire row should be shown in the UI during dragging
  3. Multi-rows drag and drop is not working
• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 22 October 2019, 10:33 pm EST

  Hi,

  Regarding drag and drop using cells:

  We are sorry but this is not possible because there are many events handlers added on the dragging of cells, like changing the selection, etc. Adding drag and drop on the cells could hinder the selection and may break the application.

  I have updated the sample and added the other 2 requirements.

  https://stackblitz.com/edit/js-cejnbr

  For the UI during dragging, I have added ‘wj-drag-image’ CSS class. You could use this class to customize the look of the UI.

  Please take a look at the sample and let me know if you have any other requirements.

  ~regards