Remplir le tableau JavaScript de la liste JSP

Question

Ok alors peut-être que quelqu'un peut m'aider avec un problème que j'essaie de résoudre. Essentiellement, j'ai une page JSP qui obtient une liste d'objets Pays (à partir de la méthode referenceData() à partir d'un portlet Spring SimpleFormController, ce qui n'est pas tout à fait pertinent mais juste mentionner si c'est le cas). Chaque objet Pays a un ensemble d'objets de province et chaque province et le pays ont un champ Nom:

public class Country { 
    private String name; 
    private Set<Province> provinces; 

    //Getters and setters 
} 

public class Province { 
    private String name; 

    //Getters and setters 
} 

Maintenant, j'ai deux menus déroulants dans mon JSP pour les pays et les provinces et je veux filtrer les provinces par pays. J'ai suivi ce tutorial/guide pour faire une sélection de chaîne en JavaScript.

Maintenant j'ai besoin d'un moyen dynamique de créer le tableau JavaScript à partir de mon contenu. Et avant que quelqu'un ne mentionne AJAX, c'est hors de question puisque notre projet utilise des portlets et que nous ne voulons pas utiliser des frameworks comme DWR ou créer une servlet. Voici le JavaScript/JSP je jusqu'à présent, mais ce ne sont pas peuplant le tableau avec quoi que ce soit:

var countries = new Array(); 
<c:forEach items="${countryList}" var="country" varStatus="status"> 
    countries[status.index] = new Array(); 
    countries[status.index]['country'] = ${country.name}; 
    countries[status.index]['provinces'] = 
    [ 
     <c:forEach items="${country.provinces}" var="province" varStatus="provinceStatus"> 
      '${province.name}' 
      <c:if test="${!provinceStatus.last}"> 
       , 
      </c:if> 
     </c:forEach> 
    ]; 
</c:forEach> 

Est-ce que quelqu'un sait comment créer un tableau JavaScript JSP dans le cas ci-dessus ou ce que les « meilleures pratiques » serait considéré dans ce cas? Merci d'avance!

Answer 1

var countries = new Array(); 
<c:forEach items="${countryList}" var="country" varStatus="status"> 
    countryDetails = new Object(); 
    countryDetails.country = ${country.name}; 
    var provinces = new Array(); 

     <c:forEach items="${country.provinces}" var="province" varStatus="provinceStatus"> 
      provinces.push(${province.name}); 
     </c:forEach> 
    countryDetails.provinces = provinces; 
    countries.push(countryDetails); 
</c:forEach> 

maintenant ce que vous avez est quelque chose comme ça en javascript

var countries = [ 
    {country:"USA", 
    provinces: [ 
    "Ohio", 
    "New York", 
    "California" 
    ]}, 
    {country:"Canada", 
    provinces: [ 
    "Ontario", 
    "Northern Territory", 
    "Sascetchewan" 
    ]}, 
] 

L'autre option serait de rendre votre sortie ressembler le javascript que j'ai posté.

var countries = [ 
<c:forEach items="${countryList}" var="country" varStatus="status"> 
    {country: '${country.name}', 
    provinces : [ 
     <c:forEach items="${country.provinces}" var="province" varStatus="provinceStatus"> 
      '${province.name}' 
      <c:if test="${!provinceStatus.last}">  
      ,  
      </c:if> 
     </c:forEach> 
    ]} 
    <c:if test="${!status.last}">  
     ,  
    </c:if> 
    </c:forEach> 
]; 

Answer 2

Avez-vous envisagé d'utiliser JSON? Il existe plusieurs bibliothèques qui peuvent prendre une collection générique et sortir JSON for Java and other languages.

Answer 3

Le principal problème dans votre code est que vous avez oublié de mettre « status.index » à l'intérieur ${ }.

countries[${status.index}] = new Array(); 

Maintenant, cela étant dit, ce serait une façon assez mauvais pour faire des choses parce que vous finiriez avec un beaucoup du code Javascript dans votre page. Beaucoup mieux de créer la liste en utilisant la notation d'objet Javascript comme dans la deuxième des réponses de John Hartsock.