web-dev-qa-db-fra.com

Comment accéder aux attributs de modèle en Javascript

Je souhaite accéder à un attribut de modèle en Javascript. J'utilise le code suivant:

model.addAttribute("data", responseDTO);

Mon cours de DTO: 

public class ResponseDTO {

    private List<ObjectError> errors;

    private Boolean actionPassed;

    private String dataRequestName;

    // and setter getter for all fields
}

J'ai essayé d'accéder au DTO en utilisant:

var data = "${data}";

Mais il me donne plutôt une représentation sous forme de chaîne de responseDTO, à savoir com.req.dto.ResponseDTO@115f4ea. Je peux accéder avec succès à un champ à l'intérieur du DTO en utilisant: 

 var data = "${data.actionPassed}";

Mais cela ne fonctionne pas pour l'attribut errors à l'intérieur du DTO, car il s'agit d'un List de ObjectError. Comment obtenir un objet responseDTO complet en Javascript? 

Merci! 

MODIFIER :  

Au départ, j'utilisais jquery.post 

$.post('ajax/test.html', function(data) {
  // Here I was able to retrieve every attribute even list of ObjectError.
});

Maintenant, je veux supprimer Ajax et le convertir en une approche non ajax (pour des raisons inévitables). Je suis donc en train de soumettre un formulaire normal et je veux le charger à nouveau et essayer de charger l'attribut de modèle data en Javascript afin de pouvoir conserver le reste du code tel quel.
Je me demandais si cela pouvait être réalisé en Javascript, comme cela est faisable avec Jquery post? 

EDIT 2:  

J'ai essayé (Merci @Grant pour les suggestions) 

JSONObject jsonObject =JSONObject.fromObject(responseDTO);
String jsonString = jsonObject.toString();
model.addAttribute("data",jsonString);

et en Javascript 

var data = eval('('+ ${dataJson} +')');   // Getting error on this line  
alert(data.actionPassed);

Mais obtenir une erreur et aucune alerte ne s'affiche
Erreur :
enter image description here

javajavascriptspringattributes
14
xyz

Tout d’abord, il n’existe aucun moyen de convertir directement un objet Java en un objet Javascript car ils n’ont rien à voir entre eux. L'une est la langue côté serveur et l'autre est la langue côté client.

Donc, pour atteindre cet objectif, vous devez effectuer une conversion. Je pense que vous avez deux options:

  1. Convertissez l'objet ResponseDTO en chaîne JSON et transmettez-le à jsp pour obtenir directement l'objet javascript.
  2. Passez l'objet ResponseDTO à JSP et remplissez l'objet javascript comme vous le tentez maintenant.

Pour l'option n ° 1, vous devez utiliser une bibliothèque pour générer une chaîne JSON par l'objet Java. Vous pouvez utiliser celui-ci JSON-lib . Par exemple:

JSONObject jsonObject = JSONObject.fromObject( responseDTO );  
/*  
  jsonStr is something like below, "errors" represents the List<ObjectError>
  I don't know what's in ObjectError, errorName is just an example property.
  {
    "dataRequestName":"request1",
    "actionPassed":true,
    "errors":[{"errorName":"error"},{"errorName":"unknown error"}]
  } 
*/
String jsonStr = jsonObject.toString();
model.addAttribute("dataJson", jsonStr);  

/*In JSP, get the corresponding javascript object
 by eval the json string directly.*/
<script>
var data = eval('('+'${dataJson}'+')'); 
</script>

Pour l'option n ° 2, 

//Pass Java object as you do now
model.addAttribute("data",responseDTO);

//In JSP, include jstl taglib to help accessing List.
<%@ taglib prefix="c" uri="http://Java.Sun.com/jsp/jstl/core" %>

<script>
var errorArr = [], errorObj;
<c:forEach var="error" items="${data.errors}">
    errorObj = { errorName: '${error.errorName}' };
    errorArr.Push(errorObj);                                  
</c:forEach>

//Populate the corresponding javascript object.
var data = {
  dataRequestName: '${data.dataRequestName}',
  actionPassed: ${data.actionPassed},
  errors: errorArr
};
</script>

Comme vous pouvez le constater, l'option n ° 2 est complexe et utile uniquement si l'objet Java est simple, tandis que l'option n ° 1 est beaucoup plus simple et facile à gérer.

17
Grant Zhu

Donc, je viens d'implémenter une solution similaire à la première option de Grant avec une liste d'objets, mais j'ai utilisé la bibliothèque Gson pour convertir l'objet en une chaîne JSON, puis JSON.parse () pour le transformer en objet JavaScript:

Sur le serveur:

List<CustomObject> foo = database.getCustomObjects();
model.addAttribute("foo", new Gson().toJson(foo));

Dans la page javascript:

var customObjectList = JSON.parse('${foo}');
console.log(customObjectList);

Notez que lorsque je fais référence à l'objet de modèle foo, je le fais sous la forme d'une chaîne '$ {foo}'. Je crois que vous obtenez votre erreur parce que vous la référencez en dehors d'une chaîne. Donc, le code correct serait:

var data = eval('('+ '${dataJson}' +')');
2
Nathan Hanna

c'est très simple

in your spring controller 

model.addAttribute("attributeName", "attributeValue");

in the script

<script type="text/javascript">      
     $(window).on('load', function () {             
            var springAttribute= '${attributeName}';
            alert(springAttribute);     
    </script>
0
srinivas gowda