J'ai un problème avec ajax et bootstrap table. J'ai un JSON ajax que j'appelle avec cette méthode:
$(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);
}
});
});
Mon JSON semble correctement mais la table ne montre aucun enregistrement. Qu'est-ce que je fais mal?
Voici aussi la définition de la table
<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>
C'est aussi une partie du json qui est retourné
[{"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"},
vérifier ceci Fiddle
vous devez spécifier le data-field
dans chaque th
et vous devez également supprimer le data-toggle="table"
data-toggle="table"
en tant que documentation : Activer la table d’amorçage sans écrire de code JavaScript. Définissez data-toggle = "table" sur une table normale.
dans votre cas, si vous ne voulez pas utiliser javascript, faites simplement votre tableau comme ci-dessous
<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>
De documentation :
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'
}]
});
Cela signifie que vous devez spécifier les colonnes qui seront utilisées en javascript et non en HTML. J'espère que cela t'aides