簡體   English   中英

如何將以下JSON數據插入表中?

[英]How to insert the following JSON Data into a table?

我很沮喪地嘗試修復以下代碼。 我是Java語言的新手,我想在這里提供一些幫助:

我有以下代碼嘗試將所有這些代碼插入Bootstrap-Table中,但沒有成功。 我總是遇到下一個錯誤:

未找到匹配的記錄。

<script>
    function showResult(sectoresURL) {

      $('#info').empty(); // First, remove all child in stack.

      $.getJSON(sectoresURL, function (json) {
        if (sectores.getVisible() && typeof(json.features[0])  != 'undefined') {
          $('#info').append('<table id=table-javascript></table>');
          buildSectorTable(sectoresURL);
        }
      });
    }

    function buildSectorTable(sectoresURL) {

      $('#table-javascript').bootstrapTable({
              method: 'get',
              url: sectoresURL,
              cache: true,
              height: 400,
              striped: true,
              pagination: true,
              pageSize: 50,
              pageList: [10, 25, 50, 100, 200],
              search: true,
              showRefresh: true,
              minimumCountColumns: 2,
              clickToSelect: false,
              showToggle: true,
              columns: [{
                  field: 'type',
                  title: 'Numero',
                  align: 'center',
                  valign: 'bottom',
                  sortable: true
              }]
      });
    }

    </script>

在這里,我只是嘗試插入“ Numero”。

順便說一下,JSON數據是:

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "id": "SectoresComunaCurico.34",
      "geometry_name": "FiguraGeometrica",
      "properties": {
        "Numero": 19,
        "Sector": "Cordillera"
      }
    }
  ],
  "crs": {
    "type": "name",
    "properties": {
      "name": "urn:ogc:def:crs:EPSG::32319"
    }
  }
}

首先,使用ID定義HTML表,以便您可以訪問它。 如果使用的是Bootstrap,請為其提供必要的類。 class="table"

<table id="table-id">
    <thead>
        <tr>
            <th>Some Header</th>
            <th>Another Header</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

現在,對於Javascript,您需要將其添加到表中。

$('#table-id > tbody').append('<tr><td>Some Content</td><td>Some Other Content</td></tr>');

如果要添加多行,請遍歷列表,並為列表中的該項目每次運行代碼。

如果您需要清除表格(新數據等),則可以使用

$('#table-id > tbody').children().remove();

如果需要,請要求進行澄清。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM