EasyUI
Drag and Drop Rows in TreeGrid
Extension » Drag and Drop Rows in TreeGrid
Include 'treegrid-dnd.js' file
Enable Drag and Drop
Properties
The properties extend from treegrid, below is the added properties for treegrid.
Name | Type | Description | Default |
---|---|---|---|
dropAccept | selector | Determine which draggable rows will be accepted. | tr[node-id] |
Events
The events extend from treegrid, below is the added events for treegrid.
Name | Parameters | Description |
---|---|---|
onBeforeDrag | row | Fires when a row's dragging starts, return false to deny drag. |
onStartDrag | row | Fires when start dragging a row. |
onStopDrag | row | Fires after stop dragging a row. |
onDragEnter | targetRow, sourceRow | Fires when a row is dragged enter some target row that can be dropped to, return false to deny drop. |
onDragOver | targetRow, sourceRow | Fires when a row is dragged over some target row that can be dropped to, return false to deny drop. |
onDragLeave | targetRow, sourceRow | Fires when a row is dragged leave some target row that can be dropped to. |
onBeforeDrop | targetRow,sourceRow,point |
Fires before a row is dropped, return false to deny drop. targetRow: The row being targeted for the drop. sourceRow: the source row. point: indicate the drop operation, posible values are: 'append','top' or 'bottom'. |
onDrop | targetRow,sourceRow,point |
Fires when a row is dropped. targetRow: the row being targeted for the drop. sourceRow: the source row. point: indicate the drop operation, posible values are: 'append','top' or 'bottom'. |
Methods
The methods below extend from treegrid.
Name | Parameter | Description |
---|---|---|
enableDnd | id | Enable dragging and dropping rows. The 'id' parameter indicates what row to be dragged and dropped. If this parameter is not specified, enable dragging and dropping all rows. |