0

1. 问题描述:

(1)看过了bootstrap table从后台获取数据之后怎么显示数据这个问题之后,发现原来之前,我从后台返回的数据格式没有遵循{"total": dataNum, "rows": [{}]}这样的格式。但是现在我好像明明都已经转成正确格式的但是依然没有办法渲染表格。
(2)而且看过另一个问题bootstrap table 返回和官方一样格式的数据 在前端无法显示,再一看我是设置了服务端分页的,但是依然没有解决我的问题。

2. 相关代码:

前端js
function initTable(){

        $("#myProgress").bootstrapTable({

            url: "api/studentRole/myProgress",
            method: "get",
            // dataType: 'json',
            // contentType: "application/json; charset=utf-8",
            // contentType: "application/x-www-form-urlencoded",
            cache: false,                        //是否使用缓存
            showColumns: true,                  //是否显示所有的列
            showRefresh: true,                  //是否显示刷新按钮
            showToggle:true,                    //是否显示详细视图和列表视图
             rowStyle: rowStyles,                //行样式
             pagination: true,                    //启用分页
             pageNumber: 1,                        //初始化加载第一页,默认第一页
             pageSize: 10,                        //每页的记录行数
             pageList: [10,20,50],                //可供选择的每页行数
             sidePagination: "server",
             
             onLoadSuccess: function(result)
             {
                 console.log("result: "+result);
             },
             onLoadError: function(err)
             {
                 console.log("error: "+err);
             },
             columns: [
             {
                 field: "index",
                 title: "序号",
                 align: "center",
                 formatter: runningFormatter
             },
             {
                 field: "id",
                 title: "学号",
                 align: "center"
             },
             {
                 field: "name",
                 title: "姓名",
                 align: "center"
             },
             {
                 field: "dormitory",
                 title: "宿舍楼",
                 align: "center"
             },
             {
                 field: "room",
                 title: "房间号",
                 align: "center"
             },
             {
                 field: "item",
                 title: "业务项目",
                 align: "center"
             },
             {
                 field: "operation",
                 title: "操作",
                 align: "center"
                 // ,formatter: operateFormatter,
                 // events: window.operateEvents
             }]
         });//end-bootstrapTable


}//end-initTable    
再附上后端相关代码:
router.get("/studentRole/myProgress", function(req, res, next)
{
    //取得当前用户,以便从数据库查看是否有该用户的操作记录
    var userInfo = JSON.parse(req.cookies.get('userInfo'));
    //!!!new
    var result = {"total": "", "rows": []};    //存储返回给前端的数据

    //取学号去数据库匹配申请记录
    Apply.findOne({sid: userInfo.username}, function(err, docs)
    {
        if(!err)
        {
            if(docs != "" && docs != null)
            {
                result.rows.push({id: docs.sid, name: docs.name, dormitory: docs.dormitory, room: docs.room, item: "申请入住"});
                result.total = result.rows.length;
            }//end-if
        }//end-if(!err)
      
    });//end-Apply.findOne

    //取学号去数据库匹配报修记录
    Fix.find({id: userInfo.username}, function(err, doc)
    {
        if(!err)
        {
            if(doc != "" && doc != null)
            {

                for(let i = 0; i < doc.length; i ++)
                {
                    result.rows.push({id: doc[i].id, name: doc[i].name, dormitory: doc[i].building, room: doc[i].room, item: "报修" });
                }
                //更新total的值
                result.total = result.rows.length;
                res.json(result);
                return;
            }
        }
       
    });//end-Fix.find


});//end-业务进度

3. 报错截图:

clipboard.png

4. 最后陈述:从控制台打印出来的就是我要渲染的数据,这样看完全是正确的它要的格式啊,但是我的table依然没有数据渲染出来。而且表格明明已经检测到我有两条数据了,但是就是不显示,请教!!!

ever 3
2018-03-29 提问
3 个回答
0

已采纳

我终于解决它了!!!
就是↓

$table.bootstrapTable({
    //省略一些属性设置...
    queryParams: function(params){
        var queryData = {};    //如果没有额外的查询参数的话就新建一个空对象,如果有的话就先装你的查询参数
        //然后增加这两个
        queryData.limit = params.limit;
        queryData.offset = params.offset;
        return queryData;    //这个就是向服务端传递的参数对象
    }
    //省略一些...
});

具体原因我也还没去细查,而且这个设置是因为我设置了服务端分页sidePagination: 'server',所以queryParams的设置大概跟这个有关系。

0

JSON.parse()一下试试

0

刚刚准备说你设置了分页,但是没有传给服务器的数据,结果你自己发现了

撰写答案

你可能感兴趣的

推广链接