溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
通常前端頁面發送ajax請求，我們只需要返回json格式數據就行
1.在pom.xml加入依賴
<properties>
<jackson.version>2.5.4</jackson.version>
</properties>
<dependencies>
<!-- controller返回json -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>${jackson.version}</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>${jackson.version}</version>
</dependency>
2.dispatcherServlet-servlet.xml中配置
<!-- 兩個標準配置 --> <!-- 將springmvc 不能處理的請求交給tomcat 例如靜態資源 --> <mvc:default-servlet-handler/> <mvc:annotation-driven> <mvc:message-converters> <bean class="org.springframework.http.converter.StringHttpMessageConverter"/> <bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"/> </mvc:message-converters> </mvc:annotation-driven>
3.在controller中獲取返回的json數據
@Controller
public class EmployeeController {
// 查詢所有員工
@Autowired
EmployeeService employeeService;
@RequestMapping("emps")
@ResponseBody
public List<Employee> getEmps() {
List<Employee> emps=employeeService.getAll();
System.out.println("emps "+emps.size());
return emps;
}
}
4.測試（使用postman）
5.前端接收數據并解析
渲染界面
<script>
$(document).ready(function(){
$(function(){
$.ajax({
url:"empsJson",
data:"pn=1",
type:"get",
success:function(data){
//獲取controller傳來的json數據
//alert(data[0].empId);
//alert(data.length)
empInfo(data);
}
})
})
})
function empInfo(data){
var str="";
for(var i=0;i<data.length;i++){
str+="<tr>"+
"<td>"+data[i].empId+"</td>"+
"<td>"+data[i].empName+"</td>"+
"<td>"+data[i].gender+"</td>"+
"<td>"+data[i].email+"</td>"+
"<td>"+data[i].dId+"</td>"+
"</tr>";
}
$("tbody").html(str)
//下面這兩種加上沒有樣式
/* for(var i=0;i<data.length;i++){
var tr=$("tbody").append("<tr></tr>");
tr.append("<td>"+data[i].empId+"</td>");
tr.append("<td>"+data[i].empName+"</td>");
tr.append("<td>"+data[i].gender+"</td>");
tr.append("<td>"+data[i].email+"</td>");
tr.append("<td>"+data[i].dId+"</td>");
} */
/* $.each(data,function(i,data){
var tr=$("tbody").append("<tr></tr>");
tr.append("<td>"+data.empId+"</td>");
tr.append("<td>"+data.empName+"</td>");
tr.append("<td>"+data.gender+"</td>");
tr.append("<td>"+data.email+"</td>");
tr.append("<td>"+data.dId+"</td>");
}) */
}
</script>
ajax發送多個參數
發送
接收
到此這篇關于ssm框架controller層返回json格式數據到頁面的實現的文章就介紹到這了,更多相關ssm controller返回json內容請搜索億速云以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持億速云！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
