Print Page - Drag and Drop Treegrid (dynamically expand nodes)

Title: Drag and Drop Treegrid (dynamically expand nodes)
Post by: siccak on August 23, 2016, 01:49:19 PM

Hello,

I am using treegrid with data from remote server via url attribute.

And this is what I am trying to achieve:

Code:

tg.treegrid({
  onLoadSuccess: (row) ->
    tg.treegrid('enableDnd', if row then row.id else null)
  onDragEnter: (targetRow, sourceRow) ->
    delay 2000, ->
      if tg.parent().find('.datagrid-row-over').attr('node-id') == targetRow.id
        tg.treegrid('expand', targetRow.id)
})

During drag phase I am trying to dynamically expand my treegrid nodes (using onDragEnter for this as shown above).

The problem is that onDragEnter event is fired only for initial nodes (before any expand). All nodes which are shown after expand event does not fire onDragEnter event.

Maybe this is not the correct way how to achieve this, but maybe someone can help me.

Thanks, Sicco

Title: Re: Drag and Drop Treegrid (dynamically expand nodes)
Post by: jarry on August 23, 2016, 06:50:40 PM

You can call 'resetDnd' method to fix this issue. Please download the 'treegrid-dnd.js' file from http://www.jeasyui.com/extension/treegrid_dnd.php

Code:

$('#tg').treegrid({
	onLoadSuccess: function(row){
		$(this).treegrid('enableDnd', row?row.id:null);
	},
	onExpand: function(){
		$(this).treegrid('resetDnd');
	},
	onDragEnter: function(targetRow, sourceRow){
		$(this).treegrid('expand', targetRow.id);
	}
});

Title: Re: Drag and Drop Treegrid (dynamically expand nodes)
Post by: siccak on August 23, 2016, 11:37:00 PM

Hello Jarry,

it works, thank you very much.

Sicco

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: siccak on August 23, 2016, 01:49:19 PM