Rellenar la matriz de JavaScript de la lista JSP

Question

Ok, tal vez alguien me pueda ayudar con un problema que estoy tratando de resolver. Básicamente, tengo una página JSP que obtiene una lista de objetos Country (del método referenceData() de Spring Portlet SimpleFormController, que no es del todo relevante, sino que solo menciona en caso de que lo sea). Cada objeto país tiene un conjunto de objetos provincia y cada provincia y el país tiene un campo de nombre:

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

    //Getters and setters 
} 

public class Province { 
    private String name; 

    //Getters and setters 
} 

Ahora tengo dos menús desplegables en mi JSP para los países y provincias y quiero filtrar las provincias por país. He estado siguiendo este tutorial/guide para hacer una selección de cadena en JavaScript.

Ahora necesito una forma dinámica de crear la matriz de JavaScript a partir de mi contenido. Y antes de que alguien mencione AJAX, esto queda descartado ya que nuestro proyecto usa portlets y nos gustaría evitar el uso de frameworks como DWR o crear un servlet. Aquí está el código JavaScript/JSP que tengo hasta ahora, pero no lo es que pueblan la matriz con cualquier cosa:

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> 

¿Alguien sabe cómo crear una matriz de JavaScript en JSP en el caso anterior o lo que el 'mejores prácticas' sería considerado en este caso? ¡Gracias por adelantado!

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> 

ahora lo que tienes es algo como esto en javascript

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

La otra opción sería la de hacer que su salida se ve como el javascript que he publicado.

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

¿Ha considerado usar JSON? Hay varias bibliotecas que pueden tomar una colección genérica y dar salida al JSON for Java and other languages.

Answer 3

El problema principal en el código es que se olvidó de poner "status.index" dentro de ${ }.

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

Ahora, dicho esto, que sería una muy mala manera de hacer las cosas porque acabaría con mucha de código Javascript en su página. Mucho mejor para crear la lista utilizando la notación de objetos JavaScript como en la segunda de las respuestas de @John Hartsock.