二級聯動

開發過程當中，很多時候我們都需要使用到二級聯動。二級聯動，無非就是數據上的關聯，我們首先就要找到數據與數據之間的關係，然後組成Map，或者List集合放到select中的value。
例如大項目與小項目：
1：組成數據組合，

Map<String, Map<String, String>> map = new HashMap<String, Map<String, String>>();
            for (ProductType p : mapList.keySet()) {
                Map<String, String> maptmp = new HashMap<String, String>();
                List<ProductType> tmpBomTypes = mapList.get(p);
                for (ProductType productBomType : tmpBomTypes) {
                    maptmp.put(productBomType.getId() + "",
                            productBomType.getTypeName());
                }
                map.put(p.getId() + "", maptmp);
            }
            JSONObject jsonObject = JSONObject.fromObject(map);
            // 放置到上下文對象中
            ValueContext.putValueContext("mapList", mapList);
            ValueContext.putValueContext("jsonMap", jsonObject);

2：jsp頁面的js和html，

<script type="text/javascript">
$(function(){
    var map  = ${jsonMap};
    var value = $("select[parent]:eq(0)").val();
        var list = map[value];
        var child = $("select[child]:eq(0)");
        for(var key in list){
            child.append("<option value='"+key+"'>"+list[key]+"</option>");
        }
    $("select[parent]").change(function(){
        var value = $(this).val();
        var list = map[value];
        var child = $("select[child]:eq(0)");
        child.empty();
        for(var key in list){
            child.append("<option value='"+key+"'>"+list[key]+"</option>");
        }
    });
})
</script>

引用：

<tr>
<td>類型：</td>
<td><select name="parent" parent="true" >
    <s:iterator value="#mapList.keySet" >
    <option value="<s:property value="id"/>"><s:property value="typeName"/></option>
    </s:iterator>
    </select>
    <select name="productType.id" child="true" > </select></td>
</tr>