在ftl界面发送ajax到后端，ftl利用freemaker获取属性数据渲染到前端页面
来源：4-1 Freemarker与Servlet整合
慕少1565072
2020-03-04 21:58:17
视频中是直接访问的fm-web/list 即，直接访问servelt页面。我现在有个需求是直接访问ftl，在ftl文件中利用Jquery 发送到 后端servlet中，再由由ajax接收后端发送的数据，由freemaker通过获取后端设置的属性，写到ftl页面内显示。我的问题是ajax由于不会刷新页面，后端设置的属性（无论是requets，session还是context三种登记属性），在ftl中不刷新，就获取不了。不要问我为什么不用js直接渲染，我只是想用用freemaker，明白他的实际使用场景。想问问解决方案是什么？
====源码===
//employee.ftl
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
2333
${salary!"不存在"}
<p id="name"></p>
<input type="button" value="点击发送ajax数据">
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script>
function send2BackEnd(){
$.ajax({
"url":"/Freemaker/list",
"type":"get",
"data":{"name":"xiaoli"},
"dataType":"text",
"success":function(text){
console.log(text);
$("#name").text(text);
}
});
}
$("input").on("click",function(){
send2BackEnd();
});
</script>
</body>
</html>//FreemakerTest.java
package com.imooc.freemaker;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet implementation class FreemakerTest
*/
@WebServlet("/list")
public class FreemakerTest extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public FreemakerTest() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
request.setAttribute("salary", "8000");
String name = request.getParameter("name");
//response.getWriter().println(name);
request.getRequestDispatcher("/employee.ftl").forward(request, response);
}
}希望能够尽快解答，非常感谢!!!
写回答
1回答
-
好帮手慕小尤
2020-03-05
同学你好，首先，我们这个ftl文件肯定是要去请求后端，返回数据的，否则就无法显示。其次，老师理解的同学的意思是不是，现在你只能去手动触发使其去发送ajax请求，你想要的是一加载这个页面，ajax就主动去像后端发起请求呢？如果是，同学按照下边这个方法试试，老师把同学的手动提交事件改成了load，代码如下所示：可以使页面加载到这里的时候就去触发。如果老师没有理解对同学的意思，请同学再次详细描述一下。如果同学想要不访问后端而直接显示，是做不到的。
function send2BackEnd(){ $.ajax({ "url":"/fm-web/FreemakerTest", "type":"get", "data":{"name":"xiaoli"}, "dataType":"text", "success":function(text){ console.log(text); $("#name").text(text); } }); } $(window).on("load",function(){ send2BackEnd(); });如果我的回答解决了你的疑惑，请采纳！祝学习愉快！
0
相似问题