在下面的代码中,对Web api方法进行了ajax调用,我以json字符串格式获取数据,但树形视图未显示数据。它只是显示一个具有空值的节点,我的代码有什么问题?
我认为dyna树未以某些数据类型不匹配的正确格式获取json。
function loadDropDownTreeView() {
var isMultiSelect = true;
var tabName = "Allocation_Factor";
var filterName ="Procurement Team Hierarchy";
try {
var dependeeRefresh = false;
// var data = JSON.stringify(constructDownloadJSON(pageName, tabName));
//showAjaxLoadingAnimation();
$("#dropDownTreeViewID").treeSelect({
placeholderText: "Select items for " + filterName,
searchNoResultsText: "No matches found.",
flexibleWidth: false, // set if dynatree container is fixed-width (width of dropdown) or flexi-width (grows with data node width)
//maxHeight: 300, // in pixels; if the tree exceeds this height, the panel will render a scroll-bar
flexibleHeight: false, // set if dynatree container is fixed-height (decided by maxHeight) or flexi-height (grows with data node height)
isMultiLevel:true, // set if the tree has more than one levels
dynatree: {
autoFocus: false, // when a node is expanded, don't scroll to focus on it
checkbox: true,
classNames: isMultiSelect ? undefined : { checkbox: "dynatree-radio" },
selectMode: isMultiSelect ? 3 : 1, // Cascading multiple select
ajaxDefaults: { // used by initAjax and onLazyRead
//cache: true, // false: Append random '_' argument to the request url to prevent caching.
type: "POST",
contentType: "application/json; charset=utf-8", // pass json format to server-side web methods
dataType: "json" // Expect json format back from server-side web methods
},
initAjax: {
//url: "http://localhost:55268/WebService1.asmx/Helloworld",
url: "/api/ULSPAPI/GetTreeData",
dataType: "json",
// data: JSON.stringify({ data })
},
onPostInit: function (isReloading, isError) {
// actions to execute after tree init
// hideAjaxLoadingAnimation();
},
persist: true,
onSelect: function (select, dtnode) {
alert('Onselect');
dependeeRefresh = false;
var selKeys = $.map(dtnode.tree.getSelectedNodes(), function (node) {
if (!node.getParent().isSelected() || node.getParent() == dtnode.tree.getRoot()) {
var level_and_node_id = node.getLevel() + "_" + node.data.key.split("_")[1];
return level_and_node_id;
}
});
var selDesc = $.map(dtnode.tree.getSelectedNodes(), function (node) {
if (!node.getParent().isSelected() || node.getParent() == dtnode.tree.getRoot()) {
var node_desc = node.data.title;
return node_desc;
}
});
var selId = $.map(dtnode.tree.getSelectedNodes(), function (node) {
if (!node.getParent().isSelected() || node.getParent() == dtnode.tree.getRoot()) {
var node_desc = node.data.key;
return node_desc;
}
});
var selectedKey = {};
selectedKey["title"] = filterName;
selectedKey["selected"] = selKeys.join(",");
selectedKey["desc"] = selDesc.join(",");
selectedKey["id"] = selId.join(",");
if (_filtersData[tabName] == undefined) {
_filtersData[tabName] = [];
}
var existingFilterData = function (title) {
if (_filtersData[tabName] !== undefined) {
for (var i = 0, len = _filtersData[tabName].length; i < len; i++) {
if (_filtersData[tabName][i].title === title)
return _filtersData[tabName][i]; // Return as soon as the object is found
}
}
return null; // The object was not found
}
if (existingFilterData(filterName) != null) {
_filtersData[tabName] = $.grep(_filtersData[tabName], function (el, idx) { return el.title == filterName }, true);
}
if (selectedKey["selected"] != "") {
_filtersData[tabName].push(selectedKey);
}
else {
if ($.isEmptyObject(_filtersData[tabName]))
delete _filtersData[tabName];
dependeeRefresh = true;
}
if (delink !== "") {
if (existingFilterData(filterName) != null) {
if ($("#" + delink + ":checked").length > 0)
$("#" + delink).click();
$("#" + delink).attr("disabled", true);
}
else
$("#" + delink).attr("disabled", false);
}
}
},
onChange: function (tree) {
// alert('onChange');
//here you can access tree.selectedText, tree.selectedNodes, tree.selectedNodeKeys, tree.selectedNodeCaptions
},
onClose: function (tree) {
//alert('onClose');
//if (_filtersData[tabName] !== undefined) {
// for (var i = 0, len = _filtersData[tabName].length; i < len; i++) {
// if (_filtersData[tabName][i].title === filterName && dependee != "") {
// var dependeeList = dependee.split(',');
// for (var index = 0; index < dependeeList.length; index++) {
// var dependeeId = "#" + tabName + "_" + dependeeList[index].replace(/\s/g, "_");
// var dependeeName = dependeeList[index];
// var treeId = $(dependeeId).siblings(".ts-parent").find(".ts-tree");
// //if ($(treeId).dynatree("getTree").getSelectedNodes(true).length <= 0)
// addFilterData(dependeeId, treeId, pageName, tabName, dependeeName);
// }
// }
// }
//}
//if (dependeeRefresh && dependee != "") {
// var dependeeList = dependee.split(',');
// for (var index = 0; index < dependeeList.length; index++) {
// var dependeeId = "#" + tabName + "_" + dependeeList[index].replace(/\s/g, "_");
// var dependeeName = dependeeList[index];
// var treeId = $(dependeeId).siblings(".ts-parent").find(".ts-tree");
// //$(dependeeId).treeSelect("clearAll");
// addFilterData(dependeeId, treeId, pageName, tabName, dependeeName);
// }
//}
}
});
}
catch (ex) {
alert('Error');
}
}
下面是我传递给dynatree的json字符串
[
{
"title": "Chemicals",
"key": "Product Network_2",
"children": [
{
"title": "Fine Chemicals -Global",
"key": "Procurement Team_38",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Fragrances and Flavours - Global",
"key": "Procurement Team_4",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Inorganics - Global",
"key": "Procurement Team_19",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Oleochemicals - Global",
"key": "Procurement Team_26",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Petrochemicals - Global",
"key": "Procurement Team_27",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Unallocated Chems -Global",
"key": "Procurement Team_25",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Commodities",
"key": "Product Network_3",
"children": [
{
"title": "Liquid Oils - Global",
"key": "Procurement Team_18",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Soft Commodities - Cocoa and Chocolate - Global",
"key": "Procurement Team_50",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Soft Commodities - Dairy - Global",
"key": "Procurement Team_51",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Soft Commodities - Sugar and Starch - Global",
"key": "Procurement Team_52",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Tropical Oils - Global",
"key": "Procurement Team_30",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Finished Products",
"key": "Product Network_5",
"children": [
{
"title": "Finished Products -Market",
"key": "Procurement Team_15",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Food Ingredients",
"key": "Product Network_6",
"children": [
{
"title": "Farmed Ingredients -Global",
"key": "Procurement Team_2",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Ingredients - Market",
"key": "Procurement Team_43",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Processed Ingredients - Global",
"key": "Procurement Team_40",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Packaging",
"key": "Product Network_1",
"children": [
{
"title": "Bottles",
"key": "Procurement Team_5",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Caps",
"key": "Procurement Team_35",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Closures",
"key": "Procurement Team_46",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Contact Flexibles",
"key": "Procurement Team_8",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Customer Packaging",
"key": "Procurement Team_29",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Decoration",
"key": "Procurement Team_6",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Feedstock Rigid Plastic",
"key": "Procurement Team_44",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Flexible Packaging",
"key": "Procurement Team_45",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Folding Cartons, Aseptic Packaging and IC Pots",
"key": "Procurement Team_39",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Market Packaging",
"key": "Procurement Team_33",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "MBS Display",
"key": "Procurement Team_20",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Metal Packaging",
"key": "Procurement Team_42",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Plastic Assemblies",
"key": "Procurement Team_41",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Tea Packaging",
"key": "Procurement Team_13",
"children": [],
"icon": false,
"isLazy": false
},
{
"title": "Tubs and Lids",
"key": "Procurement Team_34",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Tea",
"key": "Product Network_4",
"children": [
{
"title": "Tea and Coffee",
"key": "Procurement Team_3",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
},
{
"title": "Unknown",
"key": "Product Network_7",
"children": [
{
"title": "Unknown",
"key": "Procurement Team_7",
"children": [],
"icon": false,
"isLazy": false
}
],
"icon": false,
"isLazy": false
}
]