Springboot结合layui展示分页 table出现的 [[ 的问题

最新推荐文章于 2024-08-16 07:50:40 发布

紫电清霜

最新推荐文章于 2024-08-16 07:50:40 发布

阅读量562

点赞数 1

分类专栏： java 文章标签： layui java spingboot

本文链接：https://blog.csdn.net/xiaochongwu/article/details/88530479

版权

java 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

异常：
2018-06-29 14:07:51.492 ERROR 8980 --- [nio-8888-exec-1] o.a.c.c.C.[.[.[/].[dispatcherServlet]    : Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Request processing failed; nested exception is org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates/user/userList.html]")] with root cause


org.thymeleaf.exceptions.TemplateProcessingException: Could not parse as expression: "
{field:'id', width:80, title: 'ID', sort: true}
,{field:'loginName', width:80, title: '登录名'}
,{field:'email', width:80, title: '邮箱', sort: true}
,{field:'phone', width:80, title: 'phone'}
,{field:'userType', title: '用户类型', sort: true}
,{field:'name', title: '姓名', sort: true}
,{field:'password', title: '密码'}
" (template: "user/userList" - line 61, col 14)


解决方案：
是报错的位置提示在 cols：[[...]],就是[[]]里面的内容不能渲染

因为“[[]]”[[…]]之间的表达式在Thymeleaf被认为是内联表达式

1、或者在script标签里 th:inline="none" 就可以了
2、将[[]]换行成
[

  [

  ]

]

即可




<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
     xmlns:th="http://www.thymeleaf.org">

   <head>
      <meta charset="UTF-8">
      <meta name="renderer" content="webkit">
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
      <title>网站后台管理模版</title>
      <link rel="stylesheet" type="text/css" href="../../static/admin/layui/css/layui.css" th:href="@{admin/layui/css/layui.css}" media="all"/>
      <link rel="stylesheet" type="text/css" href="../../static/admin/css/admin.css" th:href="@{admin/css/admin.css}" />
      <script src="admin/js/jquery-3.3.1.js"></script>
      <script src="md5/md5.js" type="text/javascript"></script>
   </head>

   <body>
   <table class="layui-hide" id="test" lay-filter="test"></table>

   <script type="text/html" id="toolbarDemo">
      <div class="layui-btn-container">
         <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
         <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
         <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
      </div>
   </script>

   <script type="text/html" id="barDemo">
      <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
      <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
   </script>
   <script src="../../static/admin/layui/layui.js" th:src="@{admin/layui/layui.js}" type="text/javascript" charset="utf-8"></script>
   <script th:inline="none">
      layui.use('table', function(){
         var table = layui.table;
         table.render({
            elem: '#test'
            ,url:'/lsh/jkrPersons'
            ,toolbar: '#toolbarDemo'
            ,title: '用户数据表'
            ,cols:[
               [//表头
               {type: 'checkbox', fixed: 'left'}
               ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true,sort: true}
               ,{field:'lvshiName', title:'律师', width:120}
               ,{field:'lvshiPhone', title:'律师电话', width:120}
               ,{field:'name', title:'借款人', width:150}
               ,{field:'mobilePhone', title:'借款人手机', width:80,}
               ,{field:'cardId', title:'借款人身份证', width:100}
               ,{field:'fName', title:'出借人', width:100}
               ,{field:'fCName', title:'出借联系人', width:100}
               ,{field:'str_beginTime', title:'借款日期',width:100}
               ,{field:'str_overTime', title:'截止日期'}
               ,{fixed: 'name', title:'操作', toolbar: '#barDemo', width:150,sort: true, fixed: 'right', unresize: true, }
            ]
            ]
            ,page: true
            ,limit:10   //默认十条数据一页
            ,limits:[10,20,30,50]  //数据分页条
            ,id: 'testReload'

         });
         //头工具栏事件
         table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
               case 'getCheckData':
                  var data = checkStatus.data;
                  layer.alert(JSON.stringify(data));
                  break;
               case 'getCheckLength':
                  var data = checkStatus.data;
                  layer.msg('选中了：'+ data.length + ' 个');
                  break;
               case 'isAll':
                  layer.msg(checkStatus.isAll ? '全选': '未全选');
                  break;
            };
         });
         //监听行工具事件
         table.on('tool(test)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'del'){
               layer.confirm('真的删除行么', function(index){
                  obj.del();
                  layer.close(index);
               });
            } else if(obj.event === 'edit'){
               layer.prompt({
                  formType: 2
                  ,value: data.email
               }, function(value, index){
                  obj.update({
                     email: value
                  });
                  layer.close(index);
               });
            }
         });
      });
   </script>

   <!----新添加完毕--->
   </body>

</html>