Разобрать плоский список Json во вложенные <ul>, используя Jquery

Question

Я пытаюсь отобразить плоский объект Json в дерево, например

Answer 1

Вы можете использовать анализатор JSON, доступный с json.org , чтобы проанализировать вашу строку следующим образом:

function parseJSON(s) {
    return JSON.parse(s, function (key, value) {
        var type;
        if (value && typeof value === 'object') {
            type = value.type;
            if (typeof type === 'string' && typeof window[type] === 'function') {
                return new (window[type])(value);
            }
        }
        return value;
    });
}

var arr = parseJSON(yourStringHere);

// Build object structure with FacetSysName as key
var categories = { }, current, cat;
for (var i = 0; i < arr.length; i++) {
    current = arr[i];
    cat = current.FacetSysName;
    categories[cat] = categories[cat] || [];
    categories[cat].push(current.FacetTypeName);
}

// Build ul element and append to body
var ulOuter = $('<ul></ul>'), ulInner, li, items;
for (cat in categories) {
    li = $('<li>' + cat + '</li>').appendTo(ulOuter);
    items = categories[cat];
    ulInner = $('<ul></ul>').appendTo(li);;
    for (var i = 0; i < items.length; i++) {
        ulInner.append($('<li>' + items[i] + '</li>'));
    }
}

$(body).append(ulOuter);