1

Context : As shown in the code below in the input box inside the jsp, the fruit node from the "fruitTree" is to be dragged and dropped.

This is happening successfully on drag and drop.Every time I do a drag and drop of the fruit from the fruitTree, the previous dropped fruit node is being overwritten by the newly dragged and dropped fruit.

Problem: Now, the previously dropped fruit must not be overwritten by the new dragged and dropped fruit node. It should be possible to drag and drop multiple fruits inside the input box.

jsp: 

      <div id = "mydiv">
            <form id="addFruits">
              <div id ="fruitDetails">
              <label>Name:</label>
               <input type="text" value="" name="fruitName" id="fruitNameId" class="jstree-drop"/>
        </div>
        </form>
        </div>
<div id="fruitTree">
</div>

In javascript:

$('div#fruitTree').jstree({

"crrm":{
"move":{
"check_move":function(m){
return false;
}
}
},
"json_data:{
"data":fruitDataReceivedFromDBSuccessfully
},
"themes":{
"theme":"apple",
"icons":true
},
"dnd":{
"drop_finish":function(data){
$('#fruitNameId').attr("value", $(data.o).attr("name");
},
"drop_check":function(data){}
},
"plugins":["themes","json_data","ui","languages","contextmenu","dnd","search","cookies","crrm","core"]
});

I am not sure if the jstree dnd plugin allows multiple drag and drops at the same target without the previous value being overwritten. I already tried using the core plugin of jstree to solve this as below but it didn't work:

"core" {
"multiple:true,
"animation":0
}

Any suggestions please?

raikumardipak
  • 1,461
  • 2
  • 29
  • 49
  • I take it you are using jsTree v.1? Consider upgrading - v1 has not been supported for years, I doubt you will find someone to help you (as I am the creator of the plugin, I can assure you v3 is actively supported). – vakata May 26 '15 at 09:20
  • :) @vakata It's wonderful to get a reply from the master!!! I'll try upgrading to v3 as you told and see if it allows multiple nodes to be dragged and dropped at the same time ...if not then i must circumvent ! – raikumardipak May 26 '15 at 10:24
  • v3 supports multiple nodes drag and drop, but keep in mind the api has changed a bit - treat it as a new product and read the docs in the repo and on jstree.com (the repo is a bit better as it has jsfiddles). – vakata May 26 '15 at 10:30
  • @vakata As I go through the doc I had a doubt to share. The core plugin by default allows multiple nodes selection. But in my case I am trying to drag multiple nodes from jstree and drop onto an input box which is inside a form element to be submitted. The input box has a class="jstree-drop" making it droppable. Do we have something as class="jstree-drop-multiple" so that multiple nodes can be dropped onto the input box without previous drops being overwritten. I already have posted a workaround but I guess the jstree itself would allow me to achieve this without the workaround. – raikumardipak May 27 '15 at 05:02
  • This is how you achieve external items DND in v.3: https://groups.google.com/d/msg/jstree/BYppISuCFRE/KKh7oHZzNkwJ It is entirely up top you if you overwrite the previous items or not. Here is fiddle too: http://jsfiddle.net/DGAF4/517/ – vakata May 27 '15 at 05:20

1 Answers1

0

As a workaround I already have done something as below: 

    "drop_finish":function(data){
    if($('#fruitNameId').attr()!=""){
        $('#fruitNameId').attr().append($('#fruitNameId').attr("value", $(data.o).attr("name"));
} else {
    $('#fruitNameId').attr("value", $(data.o).attr("name")
    }
    }
raikumardipak
  • 1,461
  • 2
  • 29
  • 49