JStree를 사용하여 카테고리/하위 카테고리 트리를 만들려고합니다. 꽤 많은 시간이 걸렸지 만 데이터베이스에서 검색하는 JSON 데이터를 사용하여 트리를 만들 수있었습니다 (PHP를 사용하여 쿼리 및 JSON 객체 작성).JStree : 트리에서 드래그 앤 드롭
이제 드래그 동작을 추적 할 수 있기를 바랍니다. & I : 하위 카테고리 x 메인 카테고리에서 메인 카테고리로 드래그 b. 작업 후에 데이터베이스를 변경하려면이 내용을 기록해야합니다. 'check_move'또는 'drop_finish'함수가 필요하다고 생각했습니다. 드롭 마침이 전혀 작동하지 않으면 이벤트가 트리거되지 않습니다. 이것은 내 노드가 jstree-drop 클래스를 가지고 있지 않기 때문인 것으로 보이지만 올바르게 삽입 된 클래스를 얻지 못하는 것 같습니다. 작동하지 않습니다.
check_move 함수는 다른 하위 범주를 통과 할 때 계속 트리거되어 원치 않는 데이터가로드됩니다.
내 (테스트) JSON 데이터 :
[
{
"metadata": {
"id": "1"
},
"data": "Geluid",
"children": [
{
"data": "Speakers",
"attr": {
"href": ""
},
"metadata": {
"id": "1"
}
},
{
"data": "Versterkers",
"attr": {
"href": ""
},
"metadata": {
"id": "3"
}
}
]
},
{
"metadata": {
"id": "2"
},
"data": "Licht",
"children": [
{
"data": "Parren",
"attr": {
"href": ""
},
"metadata": {
"id": "2"
}
}
]
}
]
내 JStree 코드 :
$(function() {
$("#Create").click(function() {
$("#tree").jstree("create");
});
$("#Rename").click(function() {
$("#tree").jstree("rename");
});
$("#Remove").click(function() {
$("#tree").jstree("remove");
});
$("#tree").jstree({
"dnd" : {
"drop_finish" : function (data) {
alert ("Drag OK");
//alert("Dragged: " + data.o.attr('id') + " to " + data.r.attr('id'));
}
},
"themes" : {
"theme" : "classic",
"dots" : true,
"icons" : false
},
"json_data" : {
"ajax" : {
"url" : "get_category_tree.php"
}
},
"plugins" : [ "themes", "json_data", "ui", "crrm", "checkbox", "dnd" ]
})
.bind("select_node.jstree", function (e, data) {
var req = new ZaxasRequest();
req.getContent("category_content.php?id=" + data.rslt.obj.data('id') +"", "category_content");
})
});
기본적으로,이 ID의를 좀하고 싶습니다. 메인 카테고리와 하위 카테고리 ID가 동일 할 수도 있다는 사실에 대해 걱정하지 마십시오. 나중에 문제를 해결할 것입니다.) 누구나 올바른 방향으로 나를 가리킬 수 있습니까?
비슷한 질문에 대한 답은 여기에서 찾을 수 있습니다. http://stackoverflow.com/questions/6110708/bindmove-node-jstree-data-rslt-obj-undefined-how-to : [1] [1] [여기를 클릭] -get-node-data – Teja