Maison > interface Web > js tutoriel > Comment faire fonctionner js lors du passage de json au contrôleur

Comment faire fonctionner js lors du passage de json au contrôleur

php中世界最好的语言
Libérer: 2018-05-03 09:36:18
original
1600 Les gens l'ont consulté

Cette fois, je vais vous montrer comment utiliser js pour transférer json vers le contrôleur. Quelles sont les précautions pour que js transfère json vers le contrôleur. Voici un cas pratique, jetons un coup d'œil.

Lorsque Spring MVC reçoit le paramètre de requête de collection , il doit ajouter @RequestBody avant le paramètre de collection de la méthode Controller, et l'enctype (encodage MIME) reçu par @RequestBody par défaut est application/json. Par conséquent, lors de l'envoi d'une requête POST, vous devez définir les informations d'en-tête de la requête, sinon Spring MVC ne les convertira pas automatiquement en données JSON, puis les analysera dans la collection correspondante lors de l'analyse de la collection. paramètres de requête.

Voici des exemples de paramètres de collection plus complexes qui reçoivent List, List, List>, User[] et User (le bean contient List) :

Paramètres de la collection de liste de réception :

Code js de la page :

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

2. Méthode du contrôleur :

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

Liste de réception, Paramètres de collection Utilisateur[] :

1. Classe d'entité utilisateur :

public class User { 
  private String name; 
 private String pwd; 
 //省略getter/setter 
}
Copier après la connexion

2. >

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});
Copier après la connexion
Copier après la connexion
3. Méthode du contrôleur :

Si vous souhaitez recevoir le tableau User[], il vous suffit de modifier le paramètre type de saveUsers Un @RequestBody User[] userArray fera l'affaire.

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<User> userList) { 
  … 
 } 
}
Copier après la connexion

Reçoit les paramètres de collection List> :

1. :

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});
Copier après la connexion
Copier après la connexion
2. Méthode du contrôleur :

Recevoir l'utilisateur (à l'intérieur du bean Contains List) paramètres de collection :
@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<Map<String,Object>> listMap) { 
  … 
 } 
}
Copier après la connexion

1. Classe d'entité utilisateur :

public class User { 
 private String name; 
 private String pwd; 
 private List<User> customers;//属于用户的客户群 
 //省略getter/setter 
}
Copier après la connexion
2. .Code js de la page :

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: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(user),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});
Copier après la connexion
3. Méthode du contrôleur :

Je crois avoir lu le cas dans cet article Vous maîtrisez la méthode. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody User user) { 
  List<User> customers = user.getCustomers(); 
  … 
 } 
}
Copier après la connexion
Lecture recommandée :

Utilisez jQuery pour prévisualiser localement lors du téléchargement d'images


Quels sont les points de confusion lors de l'utilisation de JS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal