ssm框架下layui前端页面table数据显示空白

原因:

1.出现err或者格式不正确,原因是后台返回数据与table规定格式不符合。

//可用一个对象返回格式
public class TableInfo {
    private Integer code ;
    private String msg ;
    private List<?> data ;
}

//Controller
@Controller
public class ProjectController {
	
	@Autowired
	private IProjectService projectService;
	
	@RequestMapping("/projectList")
	@ResponseBody
	public TableInfo projectList(){
		List<Project> list = projectService.projectList();
		return new TableInfo(0,"错误",list);
	}
}

//前端页面
    <table class="layui-hide" id="ProjectTableView"></table>
	<script>
        layui.use('table', function(){
            var table = layui.table;
            table.render({
                elem: '#ProjectTableView'   //需要渲染的位置
                ,url:'projectList'  //发送的请求
                ,method: 'get'
                ,cols: [[   //表头及分配的内容
                    {field:'project_id', title: '工程编号'}
                    ,{field:'project_name', title: '工程名称'}
                    ,{field:'deputy_name', title: '法人代表'}
                    ,{field:'telephone', title: '电话'}
                    ,{field:'addr', title: '地址'}
                ]]
            });
        });
    </script>

2.前后台无任何错误,原因是field对应的名字应该是开头字母小写。

layui.use('table', function(){
	var table = layui.table;
		  
	table.render({
		 elem: '#showStudentTableView'    //查询数据表格渲染ID
		 ,url:'showAllStudent'            //发送请求
		 ,title: '学生管理'
		 ,cols: [[
			  {field:'studentId', title:'ID'}
			  ,{field:'studentnName', title:'学生姓名'}
			  ,{field:'studentAge', title:'学生年龄', width:120}
		  ]]
		  ,page: true,
		  response:{
		      statusName:'code', //规定返回的状态码字段为code
			  statusCode:200 //规定成功的状态码味200
		  },
		  parseData:function(res){
			  return {
					"code" : res.code, //解析接口状态
					"msg" : res.msg, //解析提示文本
		    		"data" : res.data //解析数据列表
			  }
		   }
	});

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值