본문 바로가기
Library & Framework/jsTree

[jsTree] jstree 드래그 앤 드롭(dnd) 적용하기 (ft. Drag & drop plugin)

by 썸머워즈 2020. 11. 25.
반응형

jstree에서는 다양한 plugin을 제공해주는데 그중에 하나가 "dnd" 이다.

예제를 통해 알아보자.

 

▶예제1)

$('#tree').jstree({ 
	'core' : {
		'data' : [
			{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },
			{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },
			{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },
			{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" },
		],
		"check_callback" : true
	},
	"plugins" : ["dnd"]
});

 

각종 플러그인들을 사용하기 위해서는 'core'와 같은 위치인 곳에 'plugins' 를 선언해 주어 사용하여야한다.

"plugins" : ["dnd"]선언해주고

 

core 안에 "check_callback" : true 를 선언해주면 

바로 드래그 앤 드롭 사용이 가능하다.

 

 

ps : check_callback : true 를 안해주면 드래그는 되는데 이동이 안된다.

반응형


댓글

TOP