Функция push не работает внутри вложенного вызова json (из нескольких API, использующих jquery) - PullRequest
Новая
       33

Функция push не работает внутри вложенного вызова json (из нескольких API, использующих jquery)

0 голосов
/ 21 мая 2019

Я хочу создать таблицу HTML, используя несколько API-интерфейсов JSON. Эти API-интерфейсы зависят друг от друга, и поэтому мне приходится делать вложенные вызовы getJSON для одного и того же.

Я использовал вложенные вызовы getJSON. Однако работает только внешний толчок, а внутренний не работает. Поэтому в созданной таблице отображаются только названия городов.

Небольшое редактирование в коде : 

var tr;
   $( document ).ready(function() {
      $.getJSON("project.json", function(data){ 
          $.each(data, function(key, value){
            tr = [];
      tr.push('<tr>');
     $.each(value, function(key1, value1){
        $.getJSON("builder.json", function(data2){
        $.each(data2, function(key2, value2){
            if (key2 == key){
                //console.log(value2);
                 tr.push('<td>'+ (value2) +'</td>');
                 return;
            }
        });
      });
        tr.push('<td>'+ (value1.project) +'</td>');
        //console.log(value1.project);
        $.getJSON("city.json", function(data3){
        $.each(data3, function(key3, value3){
            if (key3 == value1.city){
                //console.log(value3);
                 tr.push('<td>'+ (value3) +'</td>');
                 return;
            }
        });
      });
        $.getJSON("price.json", function(data4){
        $.each(data4, function(key4, value4){
            if (key4 == value1.project_id){
                //console.log(value4);
                 tr.push('<td>'+ (value4) +'</td>');
                 return;
            }
        });
      });
     });
      tr.push('</tr>');
      $('#emp').append($(tr.join('')));
  });
 });
});

Таблица выглядит следующим образом: 

<table id="emp">
  <tr>
    <th>Builder</th>
    <th>Project</th>
    <th>City</th>
    <th>Price</th>
  </tr>

API даны как:

builder.json 

{
    "1":"alamiz builder",
    "2":"souroy builder",
    "3":"vin selv builder",
    "4":"gol mat builder",
    "5":"sm dev builder",
    "6":"zahi builder"
}

city.json 

{
    "1":"mumbai",
    "2":"delhi",
    "3":"pune",
    "4":"banglore"
}

project.json 

{
   "1":[
       {"project_id":1,"project":"Alamiz City","city":1},
       {"project_id":2,"project":"Alamiz Tech City","city":1},
       {"project_id":3,"project":"Alamiz Down Town","city":3},
       {"project_id":10,"project":"Alamiz Nature","city":2}
   ],
   "3":[
       {"project_id":4,"project":"The Tech Sky","city":1},
       {"project_id":5,"project":"Alphonso","city":1}
   ],
   "4":[
       {"project_id":6,"project":"Royal Tech","city":4},
       {"project_id":7,"project":"Future City","city":4}
   ],
   "6":[
       {"project_id":8,"project":"Zahi Skyline","city":1}
   ],
   "2":[
       {"project_id":9,"project":"Souras City","city":4}
   ]
}

price.json 

{
   "1":"2cr",
   "2":"3.5cr",
   "3":"1cr",
   "4":"2cr",
   "5":"4cr",
   "6":"4cr",
   "7":"5cr",
   "8":"3cr",
   "9":"7cr",
   "10":"6cr"
}

1 Ответ

0 голосов
/ 21 мая 2019

$. Каждый является асинхронным, и когда его выполнение внутри цикла for, который является синхронным, цикл for завершается до срабатывания любого из обратных вызовов.

https://api.jquery.com/each/

...