2016-12-07 8 views
0

ね、このjsonをソートしようとしています。jqueryを使用してオブジェクトのオブジェクト内のjsonをソートする方法

{ 
    "id": "1", 
    "parentId": "", 
    "children": [ 
     { 
      "id": "1.1", 
      "parentId": "1", 
     }, 
     { 
      "id": "1.2", 
      "parentId": "1", 
     }, 
     { 
      "id": "1.3", 
      "parentId": "1", 
     }, 
     { 
      "id": "1.4", 
      "parentId": "1", 
     }, 
     { 
      "id": "1.1.1", 
      "parentId": "1.1", 
     }, 
     { 
      "id": "1.1.2", 
      "parentId": "1.1", 
     }, 
     { 
      "id": "1.1.3", 
      "parentId": "1.1", 
     }, 
     { 
      "id": "1.1.1.1", 
      "parentId": "1.1.1", 
     }, 
     { 
      "id": "1.1.1.2", 
      "parentId": "1.1.1", 
     }, 

    ] 
} 

jsonはツリー形式でソートする必要があります。オブジェクトの親のIDが他のオブジェクトのIDと一致する場合、同様のオブジェクトがオブジェクトの下に来るなど、n番目のレベルになります。

予想される出力は次のようにすべきである:私は試みたが、それはわずか3レベル件まで表示されている

{ 
    "id": "1", 
    "parentId": "", 
    "children": [ 
     { 
      "id": "1.1", 
      "parentId": "1", 
      "children": [ 
       { 
        "id": "1.1.1", 
        "parentId": "1.1", 
        "children": [ 
         { 
          "id": "1.1.1.1", 
          "parentId": "1.1.1", 
          "children": [] 
         }, 
         { 
          "id": "1.1.1.2", 
          "parentId": "1.1.1", 
          "children": [] 
         }, 
        ] 
       }, 
       { 
        "id": "1.1.2", 
        "parentId": "1.1", 
        "children": [] 
       }, 
       { 
        "id": "1.1.3", 
        "parentId": "1.1", 
        "children": [] 
       }, 
      ] 
     }, 
     { 
      "id": "1.2", 
      "parentId": "1", 
      "children": [] 
     }, 
     { 
      "id": "1.3", 
      "parentId": "1", 
      "children": [] 
     }, 
     { 
      "id": "1.4", 
      "parentId": "1", 
      "children": [] 
     }, 
    ] 
} 

$(document).ready(function() { 
 
\t 
 
\t var json = JSON.parse(`{ 
 
    "id": "1", 
 
    "parentId": "", 
 
    "children": [ 
 
     { 
 
      "id": "1.1", 
 
      "parentId": "1" 
 
     }, 
 
     { 
 
      "id": "1.2", 
 
      "parentId": "1" 
 
     }, 
 
     { 
 
      "id": "1.3", 
 
      "parentId": "1" 
 
     }, 
 
     { 
 
      "id": "1.4", 
 
      "parentId": "1" 
 
     }, 
 
     { 
 
      "id": "1.1.1", 
 
      "parentId": "1.1" 
 
     }, 
 
     { 
 
      "id": "1.1.2", 
 
      "parentId": "1.1" 
 
     }, 
 
     { 
 
      "id": "1.1.3", 
 
      "parentId": "1.1" 
 
     }, 
 
     { 
 
      "id": "1.1.1.1", 
 
      "parentId": "1.1.1" 
 
     }, 
 
     { 
 
      "id": "1.1.1.2", 
 
      "parentId": "1.1.1" 
 
     } 
 
    ] 
 
}`); 
 

 
\t var dummyParnt = json.children; 
 
\t var dummyChild = json.children; 
 

 
\t var dataGrand= json; 
 
\t 
 
\t var data=[]; 
 

 
\t var init = function() { 
 
\t \t var children=[]; 
 
\t \t dataGrand.children=[]; 
 

 
\t \t var k,j=0; 
 

 
\t \t 
 
\t \t for(var i in dummyParnt){ 
 

 
\t \t \t if(dummyParnt[i].parentId == json.id){ 
 

 
\t \t \t \t dataGrand.children[j] = dummyParnt[i]; 
 
\t \t \t \t dataGrand.children[j].children =[]; 
 
\t \t \t \t 
 
\t \t \t \t k=0; 
 
    \t \t \t for(var a in dummyChild){ 
 

 

 
    \t \t \t \t if(dummyParnt[i].id == dummyChild[a].parentId){ 
 

 
    \t \t \t \t \t dataGrand.children[j].children[k] = dummyChild[a]; 
 
    \t \t \t \t \t k++; 
 
    \t \t \t \t } 
 
    \t \t \t } 
 
    \t \t \t j++; 
 
\t \t \t } 
 
\t \t \t 
 
\t \t } 
 
\t \t 
 
\t \t console.log(dataGrand,"datagrand"); 
 

 
      var tableHTML = '<table id="location" border=\'1\'></table>'; 
 
     var trHTML = ''; 
 

 
     trHTML += '<tr><td>' + dataGrand.id + '</td></td><td></td><td></tr>'; 
 
      
 
for(var i in dataGrand.children){ 
 
    
 
    trHTML += '<tr><td></td><td>' + dataGrand.children[i].id + '</td></td><td></tr>'; 
 
    
 
    for(var j in dataGrand.children[i].children){ 
 
    
 
    trHTML += '<tr><td></td><td></td><td>' + dataGrand.children[i].children[j].id + '</td></tr>'; 
 
    
 
}; 
 
    
 
}; 
 

 
     $('body').append(tableHTML); 
 
\t 
 
$('#location').append(trHTML); 
 
\t } 
 
    init(); 
 
});
<html> 
 
    <head> 
 
     <!-- jQuery library --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
     
 
     
 
    </head> 
 
    <body> 
 
     
 
    </body> 
 
</html>

+0

更新されたコードを見ているように3番目のレベルに達した場合は、もう1つループを入れてください。 – Varsha

+0

@Varsha入れ子オブジェクトのn番目のレベルまでソートします。 –

答えて

0

私はちょうどあなたがIDの配列を作成し、 をソートするために、この機能を適用する。..ロジックはそれを試してみるこのため

を期待どおりに動作します希望を書いていますその配列を作成し、idのソートされた配列に基づいて、 オブジェクトを目的の出力になる新しい配列にプッシュできます。

1) IDの配列を取得 - _.pluck(YOURLIST, 'id');

たり、長さ

var arrayOfIds = []; 
function getLeaf(YOURLIST) { 
    for (i=0; i > YOURLIST.length; i++) { 
     arrayOfIds.push(YOURLIST[i].id); 
     for (j=0; j > YOURLIST[i].length; j++) { 
      arrayOfIds.push(YOURLIST[i][j].id); 
      return getLeaf(YOURLIST[i][j]); // <- recursive call 
     } 
    } 
} 

に基づいてforループ内のループのために使用し、その後、underscore.jsを使用しない場合2)作成した配列をソートするには、以下の関数を呼び出します。新しいソートのArrayListに基づいて

function compareAndSort(x, y) { 
    var xParts = x.split('.'); 
    var yParts = y.split('.'); 
    var max = xParts.length > yParts.length ? yParts.length : xParts.length; 
    for (int i = 0; i < max; i++) { 
     var xInt = parseInt(xParts[i]); 
     var yInt = parseInt(yParts[i]); 
     if (xInt < yInt) { 
     return -1; 
     } 
     if (yInt < xInt) { 
     return 1; 
     } 
     if (i == max -1) { 
     if (yParts.length > xParts.length) { 
      return -1; 
     } 
     } 
    } 
    return 0; 
} 

3)、IDのソートされたリストに基づいてオブジェクトを押すことで、オブジェクトの新しい所望の出力配列を作成します。

+0

問題は私が子供のオブジェクトの子オブジェクトに到達するロジックを取得していることです。あなたの解決策をここで少し説明することができますか? –

+0

私は私の答えを編集しました。もしあなたがさらに助けを必要とするならば教えてください。ありがとう、 – Varsha

+0

オブジェクトが同じ階層にある場合、それは動作しますが、データのjsonが表示されている場合は、メインの親オブジェクトに、子または子の子であるオブジェクトが含まれています。 –

関連する問題