[Solution] disable random drag and drop of nodes in the tree control in easyui (cancel some node drag and drop effects)

Problem description:

There are some elements in the directory tree. It can be understood as files and folders. For example:

Easyui enables the tree control to implement the drag and drop function, but the drag function is too casual and everything can be dragged. That is to say, you can add another File in [file], but this does not meet my needs.

Therefore, simply summarize the requirements:

Some nodes cannot be added.

Solution:

Listen to the onBeforeDrop method of the control and judge that false is returned when the target node is a file.

Example Code: JavaScript Code

1 2 3 4 5 6 7 8 9 10 11 12 13 14

$ ('# File-tree'). tree ({ OnBeforeDrop: function (target, source, point) { If (point = 'append ') { Var targetNode = $ (this). tree ('getnode', target ); If (targetNode. type = 'file ') { Return false; } } } });

Example:

• Add a type attribute to node to distinguish between file and folder. Of course, this attribute can be specified as long as it can be separated.
• Official onBeforeDrop event documentation:

Name	Parameters	Description
OnBeforeDrop	Target, source, point	Fires before a node is dropped, return false to deny drop. Target: DOM object, The node being targeted for the drop. Source: the source node. Point: indicate the drop operation, posible values are: 'append', 'top' or 'bottom '. This event is available since version 1.3.3.

• Official getNode method documentation:

Name	Parameter	Description
GetData	Target	Get the specified node data, including its children.