struts2+ajax做的一个级联下拉列表
struts2+ajax做的一个级联下拉列表
struts端代码：
/**
* 示社群的
* @return
*/
public String showNewsType() {
newsTypeList = associationNewsTypeService.showNewsTypeListByAssnId(associationId);
return SUCCESS;
}

struts配置文件代码：
<!-- 示社群分 -->
<action name="showNewsType" method="showNewsType">
<result type="json"></result>
</action>

ajax代码：
/**
*下拉列表示
*/
function showNewsType(newsTypeId) {
var parent = document.getElementById("synAssociationSelect");
var associationId = parent.options[parent.selectedIndex].value;
if(associationId == 0) {
$("#newsTypeSelectTd").css("display","none");
} else {
var params = {"associationId":associationId};
$.ajax({
type : "post",
url : "/government/showNewsType",
async : false,
data : params,
dataType : "json",
success : function(json) {
var newsTypeSel = document.getElementById("newsTypeSelect");
newsTypeSel.length = 0;
if(json.newsTypeList.length == 0) {
newsTypeSel.options.add(new Option("社群有分", 0));
}
for(var i = 0; i < json.newsTypeList.length; i++) {
if(json.newsTypeList[i].typeId == newsTypeId) {
newsTypeSel.options.add(new Option(json.newsTypeList[i].typeName, json.newsTypeList[i].typeId, 'seleted'));
} else {
newsTypeSel.options.add(new Option(json.newsTypeList[i].typeName, json.newsTypeList[i].typeId));
}
}
}
});

$("#newsTypeSelectTd").css("display","block");
}
}

html代码：
<tr>
<td style="vertical-align:top;">同步社群：</td>
<td>
<select id="synAssociationSelect" name="governmentQuestion.synAssociationId" onchange="showNewsType($!

{governmentQuestion.associationNewsTypeId})">
#if($userAssociationList.size() > 0)
<option value="0">----</option>
#foreach($userAssociation in $userAssociationList)
<option value="$!{userAssociation.associationId}" #if($!

{governmentQuestion.synAssociationId} == $!{userAssociation.associationId})selected#end>$!{userAssociation.associationName}</option>
#end
#else
<option value="0">--您有加入社群--</option>
#end
</select>
</td>
<td id="newsTypeSelectTd" style="display:none" colspan="2">
<select id="newsTypeSelect" name="governmentQuestion.associationNewsTypeId">

</select>
</td>
</tr>