Saya pemula yang mencoba mempelajari bootstrap-table, dan telah berjuang untuk sementara waktu dengan memuat data dasar menggunakan javascript. Kode di bawah ini tampaknya berfungsi tetapi mengembalikan hasil "Tidak ditemukan catatan yang cocok".

Akan menghargai bimbingan tentang apa yang saya lakukan salah.

<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Hello, Bootstrap Table!</title>

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
    <link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.18.3/dist/bootstrap-table.min.css">
  </head>
  <body>
    <table id="table" data-toggle="table" ></table>

    <script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <script src="https://unpkg.com/bootstrap-table@1.18.3/dist/bootstrap-table.min.js"></script>
<script>
   var data = '[{"id": 0,"name": "Item 0","price": "$0"}, {"id": 1,"name": "Item 1","price": "$1"},{"id": 2,"name": "Item 2","price": "$2"}]';
   data_json=JSON.parse(data);
   $('#table').bootstrapTable('load',data_json);
</script>
  </body>
</html>
0
CodyM 12 Mei 2021, 04:38

1 menjawab

Jawaban Terbaik

Harap ubah $('#table').bootstrapTable() Anda menjadi berikut:

<script>
    var data = '[{"id": 0,"name": "Item 0","price": "$0"}, {"id": 1,"name": "Item 1","price": "$1"},{"id": 2,"name": "Item 2","price": "$2"}]';
    data_json=JSON.parse(data);
    $('#table').bootstrapTable({
        data: data_json
    });
</script>

Oke, Anda sekarang akan melihat halaman kosong (tanpa No matchign records). Ubah tag <table> di HTML Anda menjadi yang berikut:

<table id="table" data-toggle="table" >
  <thead>
    <th>Item ID</th>
    <th data-field="name">Item Name</th>
    <th data-field="price">Item Price</th>
  </thead>
</table>

<thead> harus ada sehingga bootstrap-table tahu mana yang akan ditampilkan.

0
GanHJ 12 Mei 2021, 02:14