Упорядочение объектов JSON с использованием jQuery

У меня есть следующий объект JSON, загружаемый в мое приложение и сохраняемый в переменную с именем obj:

{
    "items" : [
    {
        "name" : "item-1",
        "group" : [
        {
            "groupName" : "name-1",
            "groupPosition" : 2
        },
        {
            "groupName" : "name-2",
            "groupPosition" : 1
        }]
    },
    {
        "name" : "item-2",
        "group" : [
        {
            "groupName" : "name-1",
            "groupPosition" : 1
        },
        {
            "groupName" : "name-2",
            "groupPosition" : 2
        }]
    }]
}

Затем я делаю следующее:

var groups = new Array();
var items = new Array();
$.each(obj.items, function(i,r){
    var itemName = r.name;
    $.each(r.group, function(index, record){
        if ($.inArray(record.groupName) == -1) {
            groups.push(record.groupName);
            $('body').append('<div id="record.groupName"></div>');
        }
        $('#'+record.groupName).append('<div id="itemName">itemName</div>');
        // At this point I'm stuck as the items get added in order of iteration,
        // not according to their record.groupPosition value.
    });
});

В конечном итоге будет несколько сотен «предметов», каждый из которых содержится в неустановленном количестве «групп».

Проблема, с которой я столкнулся, заключается в том, как выполнить итерацию по объекту JSON с помощью jQuery или хорошего ol'JavaScript и отобразить элементы в правильной позиции в каждой группе, поскольку элементы и группы не будут перечислены внутри объекта JSON в последовательном порядке.

Любая помощь будет принята с благодарностью!

Спасибо.

javascript,jquery,json,

0

Ответов: 3


"за" 2 "за" принято

Почему бы просто не дать групповым позициям индекс позиции следующим образом:

{
"items" : [
{
    "name" : "item-1",
    "group" : {
    2:{
        "groupName" : "name-1",
        "groupPosition" : 2
    },
    1:{
        "groupName" : "name-2",
        "groupPosition" : 1
    }}

},
{
    "name" : "item-2",
    "group" : {
    1:{
        "groupName" : "name-1",
        "groupPosition" : 1
    },
    2:{
        "groupName" : "name-2",
        "groupPosition" : 2
    }}
}]

}


Предполагая, что у вас есть переменная, которая назначена на это:

var data = ...

Вы можете использовать $.each()метод:

$.each(data.items, function(index, item) {
    // here item.name will contain the name
    // and if you wanted to fetch the groups you could loop through them as well:
    $.each(item.group, function(i, group) {
        // here you can use group.groupName and group.groupPosition
    });
});

Массивы ( []) в javascript основаны на 0 индексах и сохраняют свой порядок, когда вы их перебираете.


Если я правильно понял вашу проблему, дело не в сортировке, а в том, как связать их с вашими dom-узлами, решение: используйте классы с числами.

Например:

$(".group"+items[1].group[0].grouposition").append(items[1].group[0].name);
// this will give append to the element with class="group1"

Если вы присоединитесь к этому с наличием структуры html, которая генерируется для совпадения имен, тогда это не будет проблемой, и вам не придется сортировать их

JavaScript, JQuery, JSON,
Похожие вопросы