Detailed explanation of the steps of passing json parameters to controller using js

This time I will bring you a detailed explanation of the steps of passing json parameters to the controller through js. What are the precautions for passing json parameters to the controller through js? The following is a practical case, let's take a look. When Spring MVC receives the collection

request parameters

, you need to add @RequestBody before the collection parameters of the Controller method, and the enctype (MIME encoding) received by @RequestBody by default is application/json. Therefore, when sending a POST request, you need to set the request header information, otherwise Spring MVC will not automatically convert it into JSON data and then parse it into the corresponding collection when parsing the collection request parameters. The following are examples of more complex collection parameters that receive List, List, List

Receive List collection parameters:

##1. Page js code:

var idList = new Array(); 
idList.push(“1”); 
idList.push(“2”); 
idList.push(“3”); 
var isBatch = false; 
$.ajax({ 
 type: "POST", 
 url: "/catalog.do?fn=deleteCatalogSchemes", 
 dataType: 'json', 
 data: {"idList":idList,"isBatch":isBatch}, 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

2. Controller method:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=deleteCatalogSchemes") 
 @ResponseBody 
 public AjaxJson deleteCatalogSchemes(@RequestParam("idList[]") List<string> idList,Boolean isBatch) { 
   … 
 } 
}</string>

Receive List, User[] collection parameters:

1. User entity class:

public class User { 
  private String name; 
 private String pwd; 
 //省略getter/setter 
}

2. Page js code:

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

3. Controller method:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<user> userList) { 
  … 
 } 
}</user>

If you want to receive the User[] array, you only need to change the parameter type of saveUsers to @RequestBody User[] userArray.

Receive List

##1. Page js code (User object is not required) ：

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

2. Controller method:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<map>> listMap) { 
  … 
 } 
}</map>

Receives the User (bean contains List) collection Parameters:

1. User entity class:

public class User { 
 private String name; 
 private String pwd; 
 private List<user> customers;//属于用户的客户群 
 //省略getter/setter 
}</user>

2. Page js code:

var customerArray = new Array(); 
customerArray.push({name: "李四",pwd: "123"}); 
customerArray.push({name: "张三",pwd: "332"}); 
var user = {}; 
user.name = "李刚"; 
user.pwd = "888"; 
user. customers = customerArray; 
$.ajax({ 
 type: "POST", 
 url: "/catalog.do?fn=saveUsers", 
 data: JSON.stringify(user),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

3. Controller method:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody User user) { 
  List<user> customers = user.getCustomers(); 
  … 
 } 
}</user>

I believe you have mastered the method after reading the case in this article. Please come for more exciting information. Pay attention to other related articles on php Chinese website! Recommended reading:

Detailed explanation of the steps for Vue to convert html strings into HTML

vue packages different parameters according to the environment Detailed explanation of domain name method

The above is the detailed content of Detailed explanation of the steps of passing json parameters to controller using js. For more information, please follow other related articles on the PHP Chinese website!