简体   繁体   English

用JSON数据填充jQuery树

[英]Populating jQuery Tree with JSON data

I am struggling from past two days to write a efficient algorithm from the json data to create the source object for jqxtree. 我过去两天都在努力从json数据中编写一种有效的算法,以创建jqxtree的源对象。 The data I receive is in this form 我收到的数据是这种形式

var data = [
{
  number: 1001,
  title: "Toyota : Corolla : LE : 2014"
}, {
  number: 1002,
  title: "Toyota : Corolla : Sports : 2015"
}, {
  number: 1003,
  title: "Toyota : Corolla : LE : 2013"
}, {
  number: 1004,
  title: "Toyota : Camry: LE : 2013"
}] 

Now I need to create a source object as 现在我需要创建一个源对象

var source = [
    { label: "Toyota", 
items: [
    { label: "Corolla",
  items : [{ label : "LE"
        items : [{label : 2014}
             {label : 2013}]},
      { label : "Sports"
        items : [{label : 2015}]} ]},
    { label: "Camry",
  items : [{ label : "LE"
        items : {label : 2013}}]}
]
}
];

Can anyone please help me with this. 谁能帮我这个忙。

Thanks 谢谢

var data = [
  {
    number: 1001,
    title: "Toyota : Corolla : LE : 2014"
  },
  {
    number: 1002,
    title: "Toyota : Corolla : Sports : 2015"
  },
  {
    number: 1003,
    title: "Toyota : Corolla : LE : 2013"
  },
  {
    number: 1004,
    title: "Toyota : Camry : LE : 2013"
  }
];


//----------------------------------------------------
function format(data){

    var result = [];

    function recurse(items, depth, target){

        for (var i = 0; i < target.length; i++) {

            if(target[i].label == items[depth]){
                depth++;
                recurse(items, depth, target[i].items);
                return;
            }
        };

        var newItem = { label: items[depth] };
        target.push(newItem);
        depth++;

        if(depth < items.length){
            recurse(items, depth, newItem.items = []);
        }       
    }

    data.forEach(function(item){
        recurse(item.title.split(" : "), 0, result);
    });

    return result;
}

console.log(JSON.stringify(format(data), null, 2));

Output: 输出:

[
  {
    "label": "Toyota",
    "items": [
      {
        "label": "Corolla",
        "items": [
          {
            "label": "LE",
            "items": [
              {
                "label": "2014"
              },
              {
                "label": "2013"
              }
            ]
          },
          {
            "label": "Sports",
            "items": [
              {
                "label": "2015"
              }
            ]
          }
        ]
      },
      {
        "label": "Camry",
        "items": [
          {
            "label": "LE",
            "items": [
              {
                "label": "2013"
              }
            ]
          }
        ]
      }
    ]
  }
]

You might want to try this. 您可能想尝试一下。 Below is the fiddle link to the code for testing. 下面是用于测试的代码的小提琴链接。

https://fiddle.jshell.net/8rqtxfyg/7/ https://fiddle.jshell.net/8rqtxfyg/7/

Below is the code: 下面是代码:

var items = [{
    number: 1001,
    title: "Toyota : Corolla : LE : 2014"
}, {
    number: 1002,
    title: "Toyota : Corolla : Sports : 2015"
}, {
    number: 1003,
    title: "Toyota : Corolla : LE : 2013"
}, {
    number: 1004,
    title: "Toyota : Camry : LE : 2013"
}];



console.log(JSON.stringify(parseTitle(items)));


function parseTitle(items) {
    var newItems = [];

    for(var i in items) {
        newItems = merge(newItems, mapper(items[i].title.split(":")));
    }

    return newItems;
}


function mapper(titles) {
    var item = {};

    item["label"] = titles.shift().replace(/^\s+|\s+$/g, "");
    if(titles.length > 0) {
        item["items"] = [];
        item["items"].push(mapper(titles));
    }

    return item;
}

function merge(items, itemToMerge, parentItem) {

    for(var i in items) {
        if(items[i]["label"] == itemToMerge["label"]) {
            if(items[i].hasOwnProperty("items") && itemToMerge.hasOwnProperty("items")) {
                items[i].items = merge(items[i].items, itemToMerge.items[0], items[i]);
            } else {
                parentItem.items.push(itemToMerge);
            }

            return items;
        }
    }

    items.push(itemToMerge);

    return items;
}

Below is the Console Output: 以下是控制台输出:

[{
    "label": "Toyota ",
    "items": [{
        "label": " Corolla ",
        "items": [{
            "label": " LE ",
            "items": [{
                "label": " 2014"
            }, {
                "label": " 2013"
            }]
        }, {
            "label": " Sports ",
            "items": [{
                "label": " 2015"
            }]
        }]
    }, {
        "label": " Camry",
        "items": [{
            "label": " LE ",
            "items": [{
                "label": " 2013"
            }]
        }]
    }]
}]

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM