javascript - 从 JSP 列表填充 JavaScript 数组

Question

好的，也许有人可以帮助我解决我正在尝试解决的问题。本质上，我有一个 JSP 页面，它获取国家/地区对象列表(来自 Spring Portlet SimpleFormController 的方法 referenceData()，不完全相关，但只是提及以防万一)。每个国家对象都有一组省对象，每个省和国家都有一个名称字段:

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

    //Getters and setters
}

public class Province {
    private String name;

    //Getters and setters
}

现在我的 JSP 中有两个针对国家和省份的下拉菜单，我想按国家/地区过滤省份。我一直在关注这个 tutorial/guide在 JavaScript 中进行链式选择。

现在我需要一种动态的方式来根据我的内容创建 JavaScript 数组。在任何人提到 AJAX 之前，这是不可能的，因为我们的项目使用 portlet，并且我们希望远离使用 DWR 之类的框架或创建 servlet。这是我目前拥有的 JavaScript/JSP，但它没有用任何东西填充数组:

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>

有谁知道在上述情况下如何在 JSP 中创建 JavaScript 数组，或者在这种情况下会考虑什么“最佳实践”？提前致谢!

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> 

现在你在 javascript 中有这样的东西

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

另一种选择是使您的输出看起来像我发布的 javascript。

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>  
];