bootstrapTable绑定不出数据,ajax返回的数据如下:

发布网友 发布时间：2022-04-24 03:25

我来回答

共2个回答

懂视网 时间：2022-05-12 02:38

使用bootstrap table 数据绑定

1、最近一直在用bootstrap table 这个前端框架做项目，下面是使用bootstrap table 的一些总结

这个使用.Net 中MVC做的：

2、这个是基本的boostrap table 的架构 ，下面的

【 queryParams:function (params){ } 】中是传递差数到后台；

热心网友 时间：2022-05-11 23:46

你返回的json数据应该是：rows:[{},{}]
$(function () {
var oTable = new TableInit();
oTable.Init();
});
var TableInit = function () {
var oTableInit = new Object();
oTableInit.queryUrl = '/Official/GetSearchFileList' + '?rnd=' +Math.random();
//初始化Table
oTableInit.Init = function () {
$('#table-javascript').bootstrapTable({
method: 'get',
url: oTableInit.queryUrl,
height: $(window).height() - 290,
striped: true,
pagination: true,
singleSelect: false,
pageSize: 2,
pageNumber: 1,
pageList: [10, 50, 100, 200, 500],
search: false, //不显示 搜索框
showColumns: false, //不显示下拉框（选择显示的列）
sidePagination: "server", //服务端请求
queryParams: oTableInit.queryParams,
minimunCountColumns: 2,
queryParamsType: "",//分页参数设置
formatNoMatches: function () {
return '未检索到**信息';
},
columns: [
{
field: 'BH',
title: '序号',
width: 20,
align: 'center',
valign: 'middle',
sortable: false,
}, {
field: 'TITLE',
title: '**名称',
width: 200,
align: 'left',
valign: 'top',
sortable: false,
}, {
field: 'Creater',
title: '创建人',
width: 50,
align: 'left',
valign: 'top',
sortable: false
}, {
field: 'CreateTime',
title: '创建时间',
width: 110,
align: 'middle',
valign: 'top',
sortable: false
}, {
field: 'operate',
title: '操作',
width: 100,
align: 'center',
valign: 'middle',
formatter: operateFormatter,
events: operateEvents
}],
onLoadSuccess: function () {
//layer.msg('加载成功');
},
onLoadError: function () {
layer.msg('未检索到**信息');
}
});
};
//销毁表格
oTableInit.Destory = function () {
$('#table-javascript').bootstrapTable('destroy');
};
//得到查询的参数
oTableInit.queryParams = function (params) {
var temp = {
pageSize: params.pageSize,
pageIndex: params.pageNumber,
Title:$("#Title").val(),
startDate: $("#startDate").val(),
endDate: $("#endDate").val()
};
return temp;
};
return oTableInit;
};
function operateFormatter(value, row, index) {
return '<a class="detail" style="color:#428bca;cursor:pointer;" >查看</a>';
}
window.operateEvents = {
'click .detail': function (e, value, row, index) {
var url = '@Url.Content("~/**/**?id=")' + row.ID;
window.open(url, '_blank');
}
};