之前对于前端框架接触较少,第一次接触thymeleaf,虽说看起来并不复杂但我还是花费了好一会儿才弄懂。

话不多少下面就简单说一下我在项目中的应用。

首先是java代码 controller层 将需要在前端展示的信息放入model中:

@RequestMapping("getAll")
public String getAll(Model model){
List<ScheduleJob> list = scheduleJobService.getAllJob();
model.addAttribute("list", list);
return "sch/quartz/list";
}

之后便是在前端html页面的遍历

 <tr th:each="job:${list}">
<td th:text="${job.name }">任务名</td>
<td th:text="${job.group }">任务组</td>
<td th:text="${job.status }">状态</td>
<td th:text='${job.cronExpression }'></td>
<td th:text="${job.className }">类名</td>
<td th:text="${job.description }">描述</td>
<td><a href="#" th:href="@{/quartz/pause(name=${job.name},group=${job.group})}">暂停</a></td>
<td><a href="#" th:href="@{/quartz/resume(name=${job.name},group=${job.group})}">恢复</a></td>
<td><a href="#" th:href="@{/quartz/run(name=${job.name},group=${job.group})}">执行一次</a></td>
<td><a href="#" th:href="@{/quartz/delete(name=${job.name},group=${job.group})}">删除</a></td>
<td><button id="edit" th:name="${job.name}" th:id="${job.group}" onclick="test(this)">修改cron表达式</button></td>
</tr>

这里直接在<tr>标签中  用 th:each 放入需要遍历的内容,以及定义变量名;在<td>标签中用th:text来展示内容。

在<a>标签中用 普通的href不能实现带参的接口请求,所以需要使用 th:href 的这种语法来实现带参的接口请求,参数用()跟在后面就可以。

至于调用js的带参方法就需要用12行那种办法 将参数作为 th 标签的name或者id传入方法中,具体的js方法如下;

 function test(obj){
var cron = $("#cron").val();
var name = $(obj).attr("name");
var group = $(obj).attr("id");
$.post("edit",{"name":name,"group":group,"cron":cron},function(){
alert("更新成功!!!");
window.location.reload();
});
}

这样就能实现js带参方法的调用,目前来说我所知道的可以实现的就是这种方式。

补充一点,前端遍历的实体类需要重写toString方法,并且必须是如下格式的:

 @Override
public String toString() {
StringBuilder builder = new StringBuilder();
builder.append("{name:\"");
builder.append(name);
builder.append("\", group:\"");
builder.append(group);
builder.append("\", cronExpression:\"");
builder.append(cronExpression);
builder.append("\", status:\"");
builder.append(status);
builder.append("\", description:\"");
builder.append(description);
builder.append("\", className:\"");
builder.append(className);
builder.append("\"}");
return builder.toString();
}

这样才能在页面上成功遍历。

对于thymeleaf,目前我也就掌握了这些简单的使用。

thymeleaf的初次使用(带参请求以及调用带参js方法)的更多相关文章

  1. JAVA发送http get/post请求,调用http接口、方法

    import java.io.BufferedReader; import java.io.IOException;import java.io.InputStream; import java.io ...

  2. Python类方法、静态方法与实例方法 -----类里面不需要实例化参数 和没带self的函数 调用此函数的方法

    来源: https://www.cnblogs.com/blackmatrix/p/5606364.html 静态方法是指类中无需实例参与即可调用的方法(不需要self参数),在调用过程中,无需将类实 ...

  3. nginx代理 (带着请求头)

    当你获得云服务器之后, 你有这样一个需求:当你要访问一个url的时候,这个URL只能在人家的云服务器上访问(比如百度),所以你要买百度的BCC,你可能在想在BCC起服务,那样有点麻烦,直接使用ngin ...

  4. 带cookie请求数据

    经常会用到一些采集网上的资源,普通网站很好采,get_file_contents()/c_url(). 有的网站会有登陆后才能采集,需要带cookie请求获取(登陆网站相同方法),下面记录一下使用方法 ...

  5. C#进阶系列——WebApi接口传参不再困惑:传参详解(转载)

    原文地址: http://www.cnblogs.com/landeanfen/p/5337072.html 前言:还记得刚使用WebApi那会儿,被它的传参机制折腾了好久,查阅了半天资料.如今,使用 ...

  6. 接口测试中三种传参请求(Map、request、Integer)解析

    注册企业接口传入的是一个request,查询企业接口传入的是一个integer:根据名称和国家名称模糊匹配接口传入的是一个Map:针对三种不同的传参我怎么作接口测试呢? 1 package com.w ...

  7. get请求中url传参中文乱码问题--集锦

    一:get请求url中带有中文参数,有三种方式进行处理防止中文乱码 1.如果使用tomcat作为服务器,那么修改tomcat配置文件conf/server.xml中,在  <Connector  ...

  8. get请求中url传参中文乱码问题

    在项目中经常会遇到中文传参数,在后台接收到乱码问题.那么在遇到这种情况下我们应该怎么进行处理让我们传到后台接收到的参数不是乱码是我们想要接收的到的,下面就是我的一些认识和理解. 一:get请求url中 ...

  9. 在基于vue的webpack脚手架开发中使用了代理转发,结果浏览器发出的请求中不带cookie导致登录时总是session失效怎么办?

    环境:            有2个业务接口需要转发到82的服务器上:     ../user/getCode.do     ../user/doLogin.do 现象:          使用上述的 ...

随机推荐

  1. 【Stage3D学习笔记续】山寨Starling(四):渲染代码实现及测试程序

    本章会实现最核心的代码,所以涉及点会比较多,这里会发布一个版本,方便日后的回退查看. 点击下载:https://codeload.github.com/hammerc/hammerc-study-St ...

  2. 实现windows和linux互传文件

    http://www.cnblogs.com/ylan2009/archive/2012/01/12/2321126.html 尝试从windows xp向ubuntu11.10传文件 ubuntu使 ...

  3. 如何使用validate.js进行动态添加和移除表单验证信息

    表单是我们在开当中的常客,那么对表单的验证也是必须的,那么如何实现动态给表单添加验证规则呢? 方法: 1,动态添加验证规则 // 添加$("#addConnectUser").ru ...

  4. Android内存中的图片

    图片在内存中的大小 Android.graphics.Bitmap类里有一个内部类Bitmap.Config类,在Bitmap类里createBitmap(intwidth, int height, ...

  5. MinGW安装和使用总结

    0.前言 最近对开源编译平台和编译器产生了兴趣,借博客平台总结一些东西(包括minGW,eclipse,sourcery和GDB调试等内容).总感觉时间一长某些东西自己都会忘记,过段时间回头看看自己的 ...

  6. 实战:ORACLE SQL Performance Analyzer

    通过 SPA,您能够依据各种更改类型(如初始化參数更改.优化器统计刷新和数据库升级)播放特定的 SQL 或整个 SQL 负载,然后生成比較报告,帮助您评估它们的影响. 在 Oracle Databas ...

  7. javascript中false值及其常见比较运算

    1. ture或者false的值 if判断中会被隐式转换成false的boolean类型的值有 false, 0, undefined , null , '', NaN(not a number) 除 ...

  8. mysql服务器辅助选项

    查看控制台命令行前缀 : echo $PS1 ,例如输出 '[\u@\h \w]#     其中,\u是用户名,\h是主机名称: hostname -s 可以查看当前主机名,  hostname 'z ...

  9. JVMInternals--reference

    This article explains the internal architecture of the Java Virtual Machine (JVM). The following dia ...

  10. Hibernate中的"Repeated column in mapping for entity"异常

    转:http://lijiejava.iteye.com/blog/786535 一对多双向关联(类Item与类Bid): Item类: public class Item { private int ...