1 2 3 4

springmvc 两个下拉框onchange事件

jsp页面部分

<li style="width:240px"><label style="width:40px">机构:</label> <select
style="height:22px" name="Searchinstid" id="Searchinstid" class="instid" onchange="select_inst(this)">        //触发事件
<option value="0" selected="selected">-请选择-</option>
<c:forEach items="${insts }" var="inst">
<option value="${inst.id }"
<c:if test="${inst.id==Searchinstid}">selected </c:if>>${inst.institutionname }</option>
</c:forEach>
</select></li>
<li style="width:240px"><label style="width:40px">店家:</label> <select
style="height:22px" name="shopid" id="shopid" class="shopselect">
<option value="0" selected="selected">-请选择-</option>
<c:forEach items="${shops}" var="shop">
<option value="${shop.id}"
<c:if test="${shop.id==shopid}">selected </c:if>>${shop.shopname }
</option>
</c:forEach>
</select></li>

jquery部分

//触发机构绑定店家列表
function select_inst(obj) {
try {
var instid = $(obj).parent().children(".instid").val();              //通过class获取触发事件的值
var shopselect = $(obj).parent().parent().children().children(".shopselect");              //通过class获取触发事件改变相对应的变量
if (instid != 0) {
$.ajax({
url : '${ctx}/account/selectByinstid',
type : 'post',
cache : false,
data : {
instid : instid
},
error : function() {
alertMsg.warn('请按照提示正确填写!');
},
success : function(data) {

$(shopselect).html("");               //清空绑定下拉框的值
$(shopselect).append($('<option >', {      
value : 0,                   
text : '请选择'
}));

if (data != null && data != "") {
$.each(data, function(i, item) {
$(shopselect).append($('<option >', {            //循环迭代后台返回的列表
value : item['id'],                                           
text : item['shopname'],

}));

});

}
}
});
}
} catch (e) {
console.error("我次哦,有异常了~", e);
}
}

 

 

---------------------------------------------------------------------------------------------------------------------------------------------------

controller部分

 

// 通过机构id查询店家列表
@RequestMapping(value = { "/selectByinstid" }, method = RequestMethod.POST)
@ResponseBody
public List<BtyShop> selectByProjectId(
HttpServletRequest request,
@RequestParam(value = "instid", defaultValue = "0", required = false) int institutionId) {
List<BtyShop> shops = btyShopService.getinstidshop(institutionId);
return shops;              //shops链表即为返回的data对象
}

posted @ 2016-09-01 15:16  一缕清风丶  阅读(372)  评论(0编辑  收藏  举报