Javascript Dojo拖放问题:将目标容器中的数据转换为JSON
我有两个DND容器,SourceContainer和TargetContainer SourceContainer包含一些json数据,例如:Javascript Dojo拖放问题:将目标容器中的数据转换为JSON,javascript,json,dojo,drag-and-drop,Javascript,Json,Dojo,Drag And Drop,我有两个DND容器,SourceContainer和TargetContainer SourceContainer包含一些json数据,例如: Apple Orange Banana 使用以下Json: var json = {"fruits": [ {"fruitId": 1, "fruitName": "Apple", "fruitDesc": "This is an Apple"}, {"fruitId": 2, "fruitName":
Apple
Orange
Banana
使用以下Json:
var json = {"fruits": [
{"fruitId": 1, "fruitName": "Apple", "fruitDesc": "This is an Apple"},
{"fruitId": 2, "fruitName": "Orange", "fruitDesc": "This is an Orange"},
{"fruitId": 3, "fruitName": "Banana", "fruitDesc": "This is a Banana"}
]
};
var results="";
for(var i=0;i<json.fruits.length;i++){
results += '<div class="dojoDndItem ">' + '<span style="visibility: hidden">' + json.fruits[i].fruitId + '</span>' + json.fruits[i].fruitName + '</div>';
}
我的SourceContainer
我的目标容器
现在,当我将Apple和Banana拖到TargetContainer并单击按钮时,我希望TargetContainer中的数据转换为Json
有没有这样做的想法。谢谢你的帮助。多谢各位
注意:强制不使用JQuery:我找到了解决方法。如果有人感兴趣,下面是解决方案 我们的Json 目标容器中的项目 创建目标容器 注:如果需要任何解释,我很乐意提供帮助
<div><label>Fruits</label></div>
<div dojoType="dojo.dnd.Source" id="source1" copyonly="false" delay="8" class="container dojoDndSource dojoDndTarget dojoDndContainer">
<div dojoType="dojo.dnd.Source" ></div> results </div>
<div><label>Basket</label></div>
<div dojoType="dojo.dnd.Source" id="source2" copyonly="false" descending="true" delay="8" class="container dojoDndSource dojoDndTarget dojoDndContainer">
<div dojoType="dojo.dnd.Source" ></div>
</div>
<button id="toJsonBtn" data-dojo-type="dijit.form.Button" type="button">ToJson</button>
var json = {"fruits": [
{"fruitId": 1, "fruitName": "Apple", "fruitDesc": "This is an Apple"},
{"fruitId": 2, "fruitName": "Orange", "fruitDesc": "This is an Orange"},
{"fruitId": 3, "fruitName": "Banana", "fruitDesc": "This is a Banana"}
]
};
Apple
Orange
Banana
var fruitListContainer = new dojo.dnd.Source("fruitNode");
dojo.connect(dojo.byId('toJsonBtn'), 'onclick', function() {
var target_container = fruitListContainer.getAllNodes();
var fruit_arr = [];
for(var i=0;i<target_container.length;i++){
var fruit_results = target_container[i].childNodes[0].nodeValue;
roles_arr.push(fruit_results);
}
var result={};
result["fruits"]=fruit_arr;
alert(JSON.stringify(result));
{"fruits":["Apple","Orange","Banana"]}