夕颜若雪_87 2022-07-31 12:35 采纳率: 66.7%
浏览 213
已结题

bootstrap table表格不显示数据

问题遇到的现象和发生背景

SpringBoot 查询到mysql数据,用bootstrap table表格渲染不显示数据,请大家帮忙看看,谢谢

img

img

问题相关代码,请勿粘贴截图
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>bootstrap-table使用</title>
  <link rel="stylesheet" type="text/css" href="js/bootstrap.min.css" />

  <script src="js/jquery.js"></script>
  <script src="js/bootstrap-table/bootstrap-table.min.js"></script>
  <script src="js/bootstrap-table/bootstrap-table-zh-CN.js"></script>
</head>
<body>
<table id="tb_departments" data-toggle="table"></table>
</body>
<script type="text/javascript">
  $(function(){
    var oTable = TableInit();
    oTable.Init();
  });

  function TableInit() {
    var oTableInit = new Object();
    //初始化Table
    oTableInit.Init = function() {
      $('#tb_departments').bootstrapTable({
        url: "stu",
        pagination: true, //分页
        search: false, //显示搜索框
        sidePagination: "server", //服务端处理分页
        pageNumber: 1, //初始化加载第一页,默认第一页
        pageSize: 5, //每页的记录行数(*)
        responseHandler:function(res) {
          return {
            "total":res.total, //总页数
            "rows": res.data   //数据
          }
        },
        columns: [
          {
            title: '序号', //标题  可不加
            width:'64px',
            align: 'center',
            valign: 'middle',
            formatter: function (value, row, index) {
              return index+1;
            }
          },
          {
            title: '姓名',
            field: 'sname',
            align: 'center',
            valign: 'middle',
          },
          {
            title: '性别',
            field: 'ssex',
            align: 'center',
            valign: 'middle',
          },
          {
            title: '年龄',
            field: 'sage',
            align: 'center',
            valign: 'middle',
          },
          {
            title: '唯一标识',
            field: 'sid',
            align: 'center',
            valign: 'middle',
          }
        ]
      });
    };
    return oTableInit;
  };
  function selBycondition(){
    var url = "/test/getPage?name=aaa";
    $("#tb_departments").bootstrapTable('refresh',{'url':url});
  }
</script>
</html>

package com.example.demo.controller;

import com.example.demo.entity.Student;
import com.example.demo.service.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

@RestController
public class StudentController {

    @Autowired
    StudentService studentService;

    @RequestMapping("/stu")
    public Map findAll(){
        List list = studentService.findAll();
        Map<String,Object>  map = new HashMap<String,Object>();
        map.put("total",list.size());
        map.put("rows",list);
        return map;
    }

}

package com.example.demo.service;

import com.example.demo.entity.Student;
import com.example.demo.mapper.StudentMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;

@Service
public class StudentService {

    @Autowired
    private StudentMapper studentMapper;

    public List<Student> findAll(){
        return studentMapper.findAll();
    }
}

  • 写回答

2条回答 默认 最新

  • 崽崽的谷雨 2022-08-01 09:19
    关注

    bootstrap.min.css 没引入成功 。可能是 路径错了 。

    其次 你需要 responseHandler 打印一下 res看看是否 请求到数据了

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 8月9日
  • 已采纳回答 8月1日
  • 创建了问题 7月31日

悬赏问题

  • ¥15 关于#linux#的问题(输入输出错误):出现这个界面接着我重新装系统,又让修电脑的师傅帮我扫描硬盘(没有问题)用着用着又卡死(相关搜索:固态硬盘)
  • ¥15 cv::resize不同线程时间不同
  • ¥15 web课程,怎么做啊😭没好好听课 根本不知道怎么下手
  • ¥15 做一个关于单片机的比较难的代码,然后搞一个PPT进行解释
  • ¥15 python提取.csv文件中的链接会经常出现爬取失败
  • ¥15 数据结构中的数组地址问题
  • ¥15 maya的mel里,怎样先选择模型A,然后利用mel脚本自动选择有相同名字的模型B呢。
  • ¥15 Python题,根本不会啊
  • ¥15 会会信号与系统和python的来
  • ¥15 关于#python#的问题