【问题标题】:How to append json object to the html table through ajax ( response is not iterable)如何通过ajax将json对象附加到html表(响应不可迭代)
【发布时间】:2021-06-15 09:10:32
【问题描述】:

我想将数据从 JSON 对象存储到我的 Html 表中。当我在 Impl 类中合并日志数据时,数据会打印在我的控制台中。但我无法将数据放入表中。

我的 JSON 对象 -

    {
        "vehicleRegID":"V001",
        "vehicleMainBrand":"Lambogini",
        "vehicleSubBrand":"A1",
        "vehicleType": "Luxry",
        "vehicleNumberOfPassage":"6",
        "vehicleTransmissionType":"Auto",
        "vehicleFuelType":"Desel",
        "vehicleColor":"Black",
        "vehicleDailyRate":"400",
        "vehicleMonthlyRate":"500",
        "vehicleFreeMiles":"2",
        "vehicleExtraKmPrice":"8000"
     }

这是我的 HTML 表格和我的 ajax 部分 -

$("#test").click(function() {
  $("#vehicleTBody").empty();
  $.ajax({
    method: 'GET',
    url: 'http://localhost:8080/Back_end_war_exploded/vehicle',
    async: true,
    success: function(response) {
      console.log(response); //object
      for (var i of response) {
        let row = `<tr><td>${i.vehicleSubBrand}</td><td>${i.vehicleRegID}</td><td>${i.vehicleSubBrand}</td><td>${i.vehicleDailyRate}</td><td>${i.vehicleMonthlyRate}</td><td>${i.vehicleFreeMiles}</td><td>${i.vehicleExtraKmPrice}</td></tr>`;
        $("#vehicleTBody").append(row);
      }

    }
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table">
  <thead>
    <tr>
      <th>Vehicle</th>
      <th>Vehicle No:</th>
      <th>Brand</th>
      <th>DailyRate</th>
      <th>MonthlyRate</th>
      <th>FreeMiles</th>
      <th>ExtraKmPrice</th>
    </tr>
  </thead>
  <tbody id="vehicleTBody">
  </tbody>
</table>

当我运行 Thin 时出现这样的错误 -

User.html?_ijt=ieo1ihg4uhcsvcrj4q1vqg1p4g:877 Uncaught TypeError: response is not iterable
    at Object.success (User.html?_ijt=ieo1ihg4uhcsvcrj4q1vqg1p4g:877)
    at u (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at k (jquery.min.js:2)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2)

【问题讨论】:

    标签: javascript jquery json ajax


    【解决方案1】:

    我找到了我自己的问题的解决方案。只有我只需将 response.data 分配给变量...

       console.log(response);//object
                    let array = response.data;
    

    【讨论】:

      猜你喜欢
      • 2019-07-26
      • 1970-01-01
      • 2022-01-08
      • 1970-01-01
      • 1970-01-01
      • 2022-12-18
      • 1970-01-01
      • 1970-01-01
      • 2019-04-30
      相关资源
      最近更新 更多