Json boot table from ajax

I have a problem with ajax and bootstrap table. I have ajax JSON that I am calling with this method:

$(document).ready(function(){

  $.ajax({
       url: 'php/process.php?method=fetchdata',
       dataType: 'json',
       success: function(data) {
           $('#clienti').bootstrapTable({
              data: data
           });
       },
       error: function(e) {
           console.log(e.responseText);
       }
    });
 });

My JSON looks right, but there is no entry in the table. What am I doing wrong?

Here is also a table definition

<table data-toggle="table" class="display table table-bordered" id="clienti">
  <thead>
    <tr>
      <th>Nome</th>
      <th>Cognome</th>
      <th>Data Nascita</th>
      <th>Provincia</th>
      <th>Comune</th>
      <th>CAP</th>
      <th>Indirizzo</th>
      <th>Fisso</th>
      <th>Cellulare</th>
      <th>Note</th>
    </tr>
  </thead>

</table>

This is also the json part that returns

[{"Nome":"","Cognome":"","DataN":"0000-00-00","Provincia":"","Comune":"","CAP":"","Indirizzo":"","Fisso":"","Mobile":"","Note":""},{"Nome":"Federico","Cognome":"Lupieri","DataN":"2015-09-16","Provincia":"","Comune":"","CAP":"34170","Indirizzo":"Via Ascoli 1","Fisso":"00112233445566","Mobile":"00112233445566","Note":"Vediamo se funziona questo"},
+4
source share
2 answers

check out this feed

you must indicate data-fieldin each thalso you must deletedata-toggle="table"

data-toggle="table"as documentation : Activate a loading table without writing JavaScript. Set data-toggle = "table" in a regular table.

, javascript,

<table data-toggle="table" class="display table table-bordered" data-url="php/process.php?method=fetchdata">
    <thead>
        <tr>
            <th data-field="Nome">Nome</th>
            <th data-field="Cognome">Cognome</th>
            <th data-field="DataN">Data Nascita</th>
            <th data-field="Provincia">Provincia</th>
            <th data-field="Comune">Comune</th>
            <th data-field="CAP">CAP</th>
            <th data-field="Indirizzo">Indirizzo</th>
            <th data-field="Fisso">Fisso</th>
            <th data-field="Mobile">Cellulare</th>
            <th data-field="Note">Note</th>
        </tr>
    </thead>
</table>
+7

:

HTML

<table id="table"></table>

JS

$('#table').bootstrapTable({
    columns: [{
        field: 'id',
        title: 'Item ID'
    }, {
        field: 'name',
        title: 'Item Name'
    }, {
        field: 'price',
        title: 'Item Price'
    }],
    data: [{
        id: 1,
        name: 'Item 1',
        price: '$1'
    }, {
        id: 2,
        name: 'Item 2',
        price: '$2'
    }]
});

, , javascript, HTML. ,

0

Source: https://habr.com/ru/post/1612504/


All Articles