Print Page - Simple drag&drop between treegrid/datagrid controls (no re-arrange)

Title: Simple drag&drop between treegrid/datagrid controls (no re-arrange)
Post by: tomb on August 12, 2014, 07:47:36 AM

I looked at the two extensions to enable drag&drop to re-order/re-arrange items, but I have a use-case where I need to be able to essentially drag one item from a treegrid to a datagrid and vice versa, and I don't want any items to automatically be re-arranged, just notified when something was dropped. I have all that mostly working with the extension, but I'm still getting the insert above/below markers, which in my use case don't make much sense. Is there an easy way to prevent these markers? I do use the re-arranging feature in another case, so I don't really want to disable it globally.

Title: Re: Simple drag&drop between treegrid/datagrid controls (no re-arrange)
Post by: stworthy on August 12, 2014, 08:41:15 PM

If you only want to drag rows to a datagrid, don't call 'enableDnd' method on the target datagrid, try the code below:

Code:

$('#dg2').datagrid('getPanel').find('div.datagrid-view').droppable({
	accept: 'tr.datagrid-row',
	onDragOver: function(e, source) {
		var icon = $(source).draggable('proxy').find('span.tree-dnd-icon');
		icon.removeClass('tree-dnd-yes tree-dnd-no').addClass('tree-dnd-yes');
	},
	onDragLeave: function(e, source) {
		var icon = $(source).draggable('proxy').find('span.tree-dnd-icon');
		icon.removeClass('tree-dnd-yes tree-dnd-no').addClass('tree-dnd-no');
	},
	onDrop: function(e, source){
		//console.log(source)
	}
})

Title: Re: Simple drag&drop between treegrid/datagrid controls (no re-arrange)
Post by: tomb on August 13, 2014, 02:16:16 PM

Hm, thanks! However, I can't seem to get it to work, it seems to refuse dropping it. I changed the accept property to accept:'tr[node-id]' (like it is in the treegrid-dnd extension), but that doesn't seem to help, either.

Title: Re: Simple drag&drop between treegrid/datagrid controls (no re-arrange)
Post by: stworthy on August 13, 2014, 07:41:44 PM

Please refer to the attached example 'test.html'. You can drag a treegrid row and append it to the datagrid component.

Title: Re: Simple drag&drop between treegrid/datagrid controls (no re-arrange)
Post by: tomb on September 03, 2014, 03:00:38 PM

Thanks, I got it to work, but it's not quite what I was trying to solve. What I really need, is to be able to know over what item in the datagrid an item was dropped. Also, I need to know where it was dragged from, as I have multiple trees/datagrids that have draggable stuff in them (although that would be more easily solvable by tagging items appropriately).

How can I find out which item is being dropped on?

EasyUI Forum

General Category => General Discussion => Topic started by: tomb on August 12, 2014, 07:47:36 AM