使用jquery和jstl下拉菜单动态添加/删除更多行

Question

我想在点击addrow按钮时使用jQuery添加新的选择下拉列表。

所以我在我的jsp文件中使用JSTL标签来创建下拉列表。

当我使用jQuery使用addrow按钮创建新行时，我希望这个新的下拉列表显示相同的值(countryList)作为默认下拉列表，这是第一次创建(在单击添加新行按钮之前)。

如何使用jQuery创建行?

SimpleFormController:

protected Map referenceData(HttpServletRequest request) throws Exception {
    Map referenceData = new HashMap();
    Map<String,String> country = new LinkedHashMap<String,String>();
    country.put("US", "United Stated");
    country.put("CHINA", "China");
    country.put("SG", "Singapore");
    country.put("MY", "Malaysia");
    referenceData.put("countryList", country);
}

形式:选择:

<form:select path="country">
   <form:option value="NONE" label="--- Select ---"/>
   <form:options items="${countryList}" />
</form:select>

的例子:

JSFiddle

注意:以上jsFiddle仅供参考

Answer 1

你好，这样做应该不成问题:

    //Execute this on button click
$('#countries').append($('<option>',
 {
    value: "China",
    text : "China"
}));

https://jsfiddle.net/b734fgcf/

html和js在生成的jsp之后执行，它应该像一个普通的html Jquery修改。如果您想将此数据发送回服务器，则可能存在一些安全问题。祝你好运!