Javascript 来自ajax的Bootstrap Table json
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33247486/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap Table json from ajax
提问by Cristian Bregant
I have a problem with ajax and bootstrap table. I have an ajax JSON I call with this method:
我有 ajax 和 bootstrap 表的问题。我有一个使用此方法调用的 ajax JSON:
$(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 seems correctly but the table doesn't show any record. What am I doing wrong?
我的 JSON 似乎正确,但表格没有显示任何记录。我究竟做错了什么?
Here is also the 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 a part of the json that is returned
这也是返回的json的一部分
[{"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"},
回答by Sherif Ahmed
check this Fiddle
检查这个小提琴
you must specify the data-field
in each th
also you must remove the data-toggle="table"
您必须data-field
在每个中指定您th
还必须删除data-toggle="table"
data-toggle="table"
as documentation: Activate bootstrap table without writing JavaScript. Set data-toggle="table" on a normal table.
data-toggle="table"
作为文档:无需编写 JavaScript 即可激活引导表。在普通表上设置 data-toggle="table"。
in your case if you don't want to use javascript just do your table as below
在您的情况下,如果您不想使用 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>
回答by Alexandru Chichinete
From documentation:
从文档:
HTML
HTML
<table id="table"></table>
JS
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: ''
}, {
id: 2,
name: 'Item 2',
price: ''
}]
});
This means that you have to specify the columns that will be used in javascript not in HTML. Hope this helps
这意味着您必须指定将在 javascript 中而不是在 HTML 中使用的列。希望这可以帮助