th:href传参
<!-- 分页-->
<div class="ui bottom attached segment" th:if="${pageCount}>1">
<div class="ui middle aligned two column grid">
<div class="column">
<a th:href="@{/home/{uid}/{pageNum}/(uid=${uid},pageNum=${pageNum}-1)}" th:unless="${pageNum==1}" class="ui mini teal basic button">上一页</a>
</div>
<div class="right aligned column">
<a th:href="@{/home/{uid}/{pageNum}/(uid=${uid},pageNum=${pageNum}+1)}" th:unless="${pageNum==pageCount}" class="ui mini teal basic button">下一页</a>
</div>
</div>
</div>
th:href="@{/home/{uid}/{pageNum}/(uid=${uid},pageNum=${pageNum}-1)}
相当于
http://localhost:8080/home/1/1 (加入uid=1,pageNum=1)
controller
@GetMapping("/home/{uid}/{pageNum}")
controller重定向带参传值跳转页面(对应上面的controller)
return "redirect:/home/"+userService.selectPasswordByUserName(userName).getUid()+"/1";
springboot+thymeleaf发送ajax请求
//id的点击事件，也可以通过$('$xxx')样式
$('#replyContent').click(function () {
var bid = [[${bid}]];
var uid = [[${uid}]];
var cid = [[${cid}]];
console.log("cid: "+cid)
var content = $('#content').val();
var data = {
"bid": bid,
"uid": uid,
"cid": cid,
"content": content
};
console.log(content)
$.ajax({
url : "http://localhost:8080/reply",
type : "POST",
headers:{"Content-Type":"application/json;charset=UTF-8"},
data: JSON.stringify(data),
success : function(data){
//弹窗
alert("评论完成!");
//留言textarea内容清空
$('#content').val("");
//评论发布、评论回复按钮的切换
$("#submitContent").show();
$('#replyContent').hide();
//刷新当前页面
window.location.reload();
},
error : function(data){
alert("评论失败!");
}
})
})
th:form登陆
Controller
@Controller
public class LoginWebController {
@Autowired
private UserService userService;
//密码、用户名参数传递
@RequestMapping("/login")
public String login(Model model) {
//设置一个模板去获取填写的form内容
//将要提交的内容封装为一个类
model.addAttribute("loginInfo",new LoginInfo());
return "login";
}
//登陆验证
@RequestMapping(value = "/loginCheck", method = RequestMethod.POST)
public String login(@ModelAttribute(value = "loginInfo") LoginInfo loginInfo) {
//获取填写的内容
String userName = loginInfo.getUserName();
String password = loginInfo.getPassword();
//验证
if(userService.selectUserName(userName) == null) {
return "login";
}else {
if(userService.selectPasswordByUserName(userName).getPassword().equalsIgnoreCase(password)) {
//跳转个人主页
return "redirect:/home/"+userService.selectPasswordByUserName(userName).getUid()+"/1";
}else {
//没登陆成功，还是到登陆页面
return "login";
}
}
}
}
vo实体
@Data
@NoArgsConstructor
@AllArgsConstructor
public class LoginInfo {
private String userName;
private String password;
}
html
<!DOCTYPE html>
<html lang="en"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css" >
<link rel="stylesheet" th:href="@{/css/me.css}">
<link rel="stylesheet" th:href="@{/css/animate.css}">
</head>
<body>
<div class="ui mobile reversed stackable grid m-margin">
<div class="ui segment m-container">
<form th:action="@{/loginCheck}" th:object="${loginInfo}" th:method="post">
<div class="ui middle aligned animated list">
<div class="m-align"><h4 class="ui green header animated rubberBand m-opacity-tiny">iBlog</h4></div>
<hr/>
<div class="item m-padded-tb">
<a class="ui orange left ribbon label">Username</a>
<div class="content">
<div class="ui left icon input vertical-align">
<input type="text" th:field="*{userName}" placeholder="userName">
<i class="user icon"></i>
</div>
</div>
</div>
<div class="item m-padded-tb">
<a class="ui teal left ribbon label">Password</a>
<div class="content">
<div class="ui left icon input vertical-align">
<input type="password" th:field="*{password}" placeholder="password">
<i class="lock icon"></i>
</div>
</div>
</div>
<div class="m-align"><button type="submit" class="small ui pink button m-opacity-tiny">登陆</button> </div>
</div>
</form>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>
</body>
</html>
