Jquery 在数据表上使用 ajax 渲染 Json 内容
Jquery Render Json Content with ajax on datatable
我想像这样呈现数据的列table:
My example
如您所见,数据table 表示“table 中没有可用数据”
我的代码是:
$(function() {
$('#Spécialité').DataTable(
{
"ajax": {
"processing": false,
"url": "show_spe",
"type": "GET",
"datatype":'json',
"async": 'true',
success: function(resp) {
let string = JSON.stringify(resp);
let obj = JSON.parse(string);
$.each( obj, function( key, value )
{
$('#Spécialité').append('<tbody><tr><td>'+obj[key]["id"]+'</td> <td>'+obj[key]["description"]+'</td><td><button type="button" class="btn btn-warning" id="edit'+obj[key]["id"]+'">Editer</button> <button type="button" class="btn btn-danger" id="edit'+obj[key]["id"]+'">Supprimer</button></td></tr></tbody>');
});
},
},
} );
我的 json 是:
0 {
id : "0"
description : "test" }
1 {
id : "1"
description : "ligne2" }
感谢您的帮助。问候 :)
我解决了问题
$(function() {
var table = $('#Spécialité').DataTable({
"ajax": {
"url": "url",
"method": "GET",
"dataSrc": ""
},
"columns": [
{ "data": "id"},
{ "data": "description"},
{
data: 'id',
render: function(data)
{
return '<button type="button" class="btn btn-warning" onclick="modalEdit('+data+')" name="edit" id="edit'+data+'">Editer</button> <button class="btn btn-danger" type="button" onclick="modalDelete('+data+')" name="delete" id="delete'+data+'">Supprimer</button> ';
}
}
],
"order": [[1, "asc"]]
});
});
我想像这样呈现数据的列table:
My example
如您所见,数据table 表示“table 中没有可用数据”
我的代码是:
$(function() {
$('#Spécialité').DataTable(
{
"ajax": {
"processing": false,
"url": "show_spe",
"type": "GET",
"datatype":'json',
"async": 'true',
success: function(resp) {
let string = JSON.stringify(resp);
let obj = JSON.parse(string);
$.each( obj, function( key, value )
{
$('#Spécialité').append('<tbody><tr><td>'+obj[key]["id"]+'</td> <td>'+obj[key]["description"]+'</td><td><button type="button" class="btn btn-warning" id="edit'+obj[key]["id"]+'">Editer</button> <button type="button" class="btn btn-danger" id="edit'+obj[key]["id"]+'">Supprimer</button></td></tr></tbody>');
});
},
},
} );
我的 json 是:
0 {
id : "0"
description : "test" }
1 {
id : "1"
description : "ligne2" }
感谢您的帮助。问候 :)
我解决了问题
$(function() {
var table = $('#Spécialité').DataTable({
"ajax": {
"url": "url",
"method": "GET",
"dataSrc": ""
},
"columns": [
{ "data": "id"},
{ "data": "description"},
{
data: 'id',
render: function(data)
{
return '<button type="button" class="btn btn-warning" onclick="modalEdit('+data+')" name="edit" id="edit'+data+'">Editer</button> <button class="btn btn-danger" type="button" onclick="modalDelete('+data+')" name="delete" id="delete'+data+'">Supprimer</button> ';
}
}
],
"order": [[1, "asc"]]
});
});