Как отделить 2 столбца данных разницы в коде Atom .js? - PullRequest
0 голосов
/ 30 января 2019

Я использую Atom-редактор для создания своего сайта.В моем файле .js я преуспеваю и извлекаю данные из базы данных, но я хочу, чтобы данные заканчивались в разных столбцах вместо одного столбца.

В файле .js у меня есть функция getAllThingData (), которая извлекает данные избаза данных и другая функция populateThingTable (thingData, thingId), которая получает свой конструктор из getAllthingDate ().Я думаю, что проблема заключается в цикле в populateThingTable ().Я попытался сделать еще один цикл с thingId.length, но кажется, что сайт не будет работать.Код, который я показываю, работает, и данные взяты из базы данных, но данные заканчиваются в одном столбце.

112 function getAllThingData() {
113  $.ajax({
114      url: "http://localhost:8080/SparkHig/listThing",
115      type: "GET",
116      dataType: "json",
117      success: function (response) {
118        var jsonResponse = response;
119        var things = [];
120        var thingId = [];
121        for(var i = 0; i < response.length; i++ ) {
122          things.push(response[i].thingName );
123          thingId.push(response[i].id);
124        }
125
126        var uniqueThing = Array.from(new Set(things));
127        var uniqueThingId = Array.from(new Set(thingId));
128        populateThingTable(uniqueThing, uniqueThingId);
129      },
130      error: function (jqXHR, textStatus, errorThrown) {
131          //alert(errorThrown + " : " + textStatus);
132      }
133  });
134 }


27 function populateThingTable(thingData, thingId) {
28
29  var table = document.querySelector(".table-body");
30  for(var i = 0; i < thingData.length; i++) {
31    var item = thingData[i];
32    var itemId = thingId[i];
33    var id = "col" + (i + 1);
34
35    var tableRowItem = document.createElement("tr");
36    var tableDelimiter1 = document.createElement("td");
37    var tableDelimiter2 = document.createElement("td");
38
39    tableDelimiter1.setAttribute("id", id);
40
41    tableDelimiter1.textContent = item;
42    tableDelimiter2.textContent = itemId;
43
44    tableRowItem.appendChild(tableDelimiter2);
45    tableRowItem.appendChild(tableDelimiter1);
46    table.appendChild(tableRowItem);
47  }
48 }

Result in website:
Column1
5Lejon
6Björn
7Katt
8Hund

What I want it to show:
Column1        Column2
5              Lejon
6              Björn
7              Katt
8              Hund

Как вы видите в разделе кода, результат, который я вижу на веб-сайте, и результат, которыйЯ хочу видеть.

...