将Json作为变量加载到jsTree中 [英] Loading Json as variable into jsTree

问题描述

我正在将jstree与Json一起使用.我的问题是我可以直接将Json提供到jsTree数据中，但是当我将其作为变量传递时，它将打印整个Json字符串作为一个节点的标题.

I am using jstree with Json. My problem is that I can provide the Json directly into jsTree data, but when I pass it as a variable it will print the entire Json string as the title of one node.

下面是nodes.json

below is nodes.json

{
  "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"
},

下面的这段代码有效

request = $.getJSON("nodes.json");
var data;
request.complete(function() {

  data = request.responseText;
  console.log(data);
  $.jstree.defaults.core.themes.responsive = true;
  $('#tree').jstree({
    plugins: ["checkbox", "sort", "types", "wholerow", "search"],
    "types": {
      "file": {
        "icon": "jstree-file"
      }
    },
    '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"
      }, ]
    }
  });
});

但这在下面不起作用

 request = $.getJSON("nodes.json");
 var data;
 request.complete(function() {

   data = request.responseText;
   console.log(data);
   $.jstree.defaults.core.themes.responsive = true;
   $('#tree').jstree({
     plugins: ["checkbox", "sort", "types", "wholerow", "search"],
     "types": {
       "file": {
         "icon": "jstree-file"
       }
     },
     'core': {
       'data': [data]
     }
   });
 });

如果您想查看代码执行，我也将其托管在我的域中. http://www.jordanmclemore.com/projects/jstree/test/visual /current.html

also if you would like to see the code execute I had it hosted on my domain. http://www.jordanmclemore.com/projects/jstree/test/visual/current.html

推荐答案

$.jstree.defaults.core.themes.responsive = true;
$('#tree').jstree({
    plugins: ["checkbox", "types"],
    "types": {
        "file": {
            "icon": "jstree-file"
        }
    },
    'core': {
        'data': {
            'url': function(node) {
                return 'nodes.json'
            },
            'data': function(node) {
                return {
                    'id': node.id
                };
            }
        }
    }
});

我刚刚更加密切地遵循了Ivan的JSTree API.他的API非常出色，密切关注它会为您省去很多麻烦.另外，我相信自己的json有一个预告逗号，并且它是无效的，因此我也必须修复它.我使用JSON验证程序进行了测试.

I just followed Ivan's JSTree API more closely. His API is fantastic and following it closely will save you a lot of headache. ALSO, my json had a trailer comma I beleive and was invalid, so I had to fix that as well. I tested using a json validator.

这篇关于将Json作为变量加载到jsTree中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！