Spring boot+Thymeleaf+easyui集成：js创建组件页面报错

开发工具：Ideal

使用场景：Demo

前提：
环境：Spring boot +Thymeleaf+easyui

引入thymeleaf模板引擎

 1 <html lang="en" xmlns:th="http://www.thymeleaf.org">
 2          Html页面引入easyui需要的文件
 3
 4 <link href="/js/jquery-easyui-1.5.3/themes/gray/easyui.css" rel="stylesheet"/>
 5
 6 <link href="/js/jquery-easyui-1.5.3/themes/icon.css" rel="stylesheet"/>
 7
 8 <script src="/js/jquery-easyui-1.5.3/jquery.min.js"></script>
 9
10 <script src="/js/jquery-easyui-1.5.3/jquery.easyui.min.js"></script>
11
12 <script src="/js/jquery-easyui-1.5.3/locale/easyui-lang-zh_CN.js"></script>

当以标签属性创建easyui组件时，页面正常显示。
以标签属性创建easyui组件：

 1 <table class="easyui-datagrid" title="Basic DataGrid" style="width:700px;height:250px"
 2
 3        data-options="singleSelect:true,collapsible:true,url:'/getUsers',method:'get'">
 4
 5     <thead>
 6
 7         <tr>
 8
 9             <th data-options="field:'id',width:80">Item ID</th>
10
11             <th data-options="field:'name',width:100">姓名</th>
12
13             <th data-options="field:'tel',width:80,align:'right'">电话</th>
14
15         </tr>
16
17     </thead>
18
19 </table>

页面效果：

当以js形式创建组件时出现问题
以js创建easyui组件

 1 <table id="dg"></table>
 2
 3 <script type="text/javascript">
 4
 5     $(function(){
 6
 7         $('#dg').datagrid({
 8
 9             url: '/getUsers',
10
11             method: 'get',
12
13             title: '用户表',
14
15             iconCls: 'icon-save',
16
17             width: 800,
18
19             height: 250,
20
21             fitColumns: true,
22
23             singleSelect: true,
24
25             columns:[[
26
27                 {field:'id',title:'Item ID',width:80},
28
29                 {field:'name',title:'姓名',width:80},
30
31                 {field:'tel',title:'电话',width:80}
32
33             ]]
34
35         });
36
37     });
38
39 </script>

效果：

后台报以下错误：

[THYMELEAF][http-nio-8080-exec-1] Exception processing template "user": Could not parse as expression: "

{field:'id',title:'Item ID',width:80},

{field:'name',title:'姓名',width:80},

{field:'tel',title:'电话',width:80}

" (template: "user" - line 26, col 27)

解决方式：
将

1 <script type="text/javascript" >

改为

1 <script type="text/javascript" th:inline="none">

总结：

在easyui页面中,script执行easyui自己的方法要加入:

1 <script th:inline="none">

原文参考：https://blog.csdn.net/xlzwhq0000004/article/details/83144440

转载于:https://www.cnblogs.com/116970u/p/10556409.html

Spring boot+Thymeleaf+easyui集成：js创建组件页面报错相关推荐

eclipse中创建jsp页面报错
eclipse中创建jsp页面报错,怎么办呢在Eclipse中新建jsp的话,很可能会出现报错.下面,我们来看看eclipse中新建jsp页面出错怎么解决吧操作步骤 1.找到新建页面所在的工程名字 ...
spring boot ajax 415,解决@RequestBody接收json对象报错415的问题
@RequestBody接收json对象报错415 前端请求: $.ajax({ url: basePath() + "/index/login.do", type : " ...
Spring Boot + Thymeleaf 创建web项目
本篇文章将引导你创建一个简单的Spring Boot web程序示例,涉及到的组件有:嵌入的Tomcat + Thymeleaf 模板引擎,可执行的 JAR 文件包. 开发工具: 1.Spring B ...
Spring Boot - Thymeleaf模板简介以及集成
文章目录 Spring Boot - Thymeleaf模板简介以及集成 1.什么是Thymeleaf? 2.标准表达式 2.1 变量表达式 2.2 选择表达式/星号表达式 2.3 URL表达式 2. ...
Spring Boot最新版集成邮件发送功能大全
Spring Boot最新版集成邮件发送功能大全前言一.开启SMTP服务并获取授权码二.创建Spring Boot项目 1.配置邮箱基本信息: 2.简单邮件发送: 3.发送带附件的邮件: 5.使 ...
基于Spring Boot 2 和 Vue.js 2 的食品科学与工程学院网站的设计与实现
摘要互联网具有传播信息容量大.形态多样.迅速方便.自由和交互等特点,已经发展成为新的传播媒体,现在很多的大学和社会其他部门都已经建立了网站,通过计算机网络实现宣传.交流及资源的整合.建立学校网站有以 ...
spring boot、mybatis集成druid数据库连接池，实现mysql cluster HA负载均衡访问
spring boot.mybatis集成druid数据库连接池,实现mysql cluster HA负载均衡访问 1.原理实现介绍本质来说使用连接池是为了节省创建.关闭数据库连接的资源消耗,从而提 ...
Spring Boot 极简集成 Shiro
点击关注公众号,Java干货及时送达 1. 前言 Apache Shiro是一个功能强大且易于使用的Java安全框架,提供了认证,授权,加密,和会话管理. Shiro有三大核心组件: Subject: ...
基于 Spring Boot 2.x 使用 Activiti 创建一个简易的请假流程
文章目录 1 摘要 2 准备工作 3 请假流程图 3 核心代码 3.1 数据库表 3.2 流程管理工具类 3.3 流程的使用 4 推荐参考资料 5 Github 源码 1 摘要工作流是需 ...

Spring boot+Thymeleaf+easyui集成：js创建组件页面报错

Spring boot+Thymeleaf+easyui集成：js创建组件页面报错相关推荐

最新文章

热门文章