效果图:
Html:
<select id="cabinType"></select>
js:
//下拉框封装方法(用到调用即可,可带参数)
function createSelect(selectId, url, value) {
$.ajax({url:url,type:"post",dataType:"json",async:false,
success:function(returnJson){
//console.log(typeof returnJson);//object
var jsonData = eval(returnJson);
if (selectId.indexOf('#') != 0) {
selectId = '#' + selectId;
}
$(selectId).empty();//清空该元素
//创建option
for (k in jsonData) {
$(selectId).append('<option value="' + jsonData[k].id + '">' + jsonData[k].text + '</option>');
}
//设置选中值
if (value != undefined && value != null && value != '') {
$(selectId).val(value);
}
}
});
}
//舱位类型下拉框
createSelect("#cabinType", "${ctx}/flights/SelectCabin");
java:
// 舱位类型下拉框
@ResponseBody
@RequestMapping("/SelectCabinType")
private ArrayList<SelectVo> SelectCabinType() {
ArrayList<SelectVo> arrayList = new ArrayList<SelectVo>();
SelectVo vo = new SelectVo(0, "---请选择---");
List<SeatCabin> selectvo =FlightInformation.SelectCabinType();//查询返回的数据
arrayList.add(vo);//将"请选择"添加到第一条
for (SeatCabin selectVo : selectvo) {
SelectVo vos = new SelectVo(selectVo.getCabinTypeID(), selectVo.getCabinTypeName());
arrayList.add(vos);
}
return arrayList;
}