以t_crash_log表中的三个字段即手机类型、运营商和应用版本作为查询字段,查询字段的值即是我们要从数据库中动态获取放在下拉框中的。
部分代码如下:
1. jsp中定义三个select标签
手机类型: <select id="deviceModel"></select>
运营商: <select id="networkOperatorName"></select>
应用版本: <select id="appVersion"></select>
2.js
/**获取供查询的下拉列表框选项值 */
function getQueryCrashLog(){
var optionsDev="<option value=''>全部</option>";
var optionsNet="<option value='all'>全部</option>"; //该字段含有null值
var optionsApp="<option value=''>全部</option>";
$.ajax({
async : false,
cache:false,
type: 'POST',
dataType : "json",
url: '<%=request.getContextPath()%>/crashLog/getQueryCrashLog.do', //请求的路径
success:function(data){ //controller层传过来的map
for(var i=0;i<data.length;i++){
var deviceSubList = data[i].deviceSubList;
var networkSubList=data[i].networkSubList;
var appSubList=data[i].appSubList;
if(data[i].deviceSubList==deviceSubList){
for(var j=0;j<deviceSubList.length;j++){
optionsDev+="<option value=\'"+deviceSubList[j]+"'\>"+deviceSubList[j]+"</option>";
}
}
if(data[i].networkSubList==networkSubList){
for(var j=0;j<networkSubList.length;j++){
optionsNet+="<option value=\'"+networkSubList[j]+"'\>"+networkSubList[j]+"</option>";
}
}
if(data[i].appSubList==appSubList){
for(var j=0;j<appSubList.length;j++){
optionsApp+="<option value=\'"+appSubList[j]+"'\>"+appSubList[j]+"</option>";
}
}
}
}
});
$("#deviceModel").html(optionsDev);
$("#networkOperatorName").html(optionsNet);
$("#appVersion").html(optionsApp);
}
3.controller层
/**
* 根据手机类型、运营商名称、应用版本名称获取查询字段下拉框的选项值
* @param
* @return
* @throws IOException
*/
@RequestMapping("/getQueryCrashLog")
public void getQueryCrashLog(HttpServletRequest request,HttpServletResponse response) throws IOException {
response.setContentType("text/html;charset=UTF-8");
Map<String, List<String>> map = new HashMap<String, List<String>>();
List<CrashLog> deviceModelList = crashLogBiz.getQueryCrashLogDevice();
List<CrashLog> networkOperatorNameList=crashLogBiz.getQueryCrashLogNetWork();
List<CrashLog> appVersionList = crashLogBiz.getQueryCrashLogApp();
List<String> deviceSubList=new ArrayList<String>();
List<String> networkSubList=new ArrayList<String>();
List<String> appSubList = new ArrayList<String>();
for(int i=0;i<deviceModelList.size();i++){
String deviceStr=deviceModelList.get(i).getDeviceModel();
if(deviceStr.length()>15){ //切取手机类型字符串
String deviceSubStr=deviceStr.substring(0,15)+"...";
deviceSubList.add(i, deviceSubStr);
}
else
deviceSubList.add(i, deviceStr);
}
for(int i=0;i<networkOperatorNameList.size();i++){
String networkStr=networkOperatorNameList.get(i).getNetworkOperatorName();
if(networkStr.length()>15){ //切取运营商字符串
String networkSubStr=networkStr.substring(0,15)+"...";
networkSubList.add(i, networkSubStr);
}
else
networkSubList.add(i, networkStr);
}
for(int i=0;i<appVersionList.size();i++){
String appStr=appVersionList.get(i).getAppVersion();
if(appStr.length()>15){ //切取应用版本字符串
String appSubStr=appStr.substring(0,15)+"...";
appSubList.add(i, appSubStr);
}
else
appSubList.add(i, appStr);
}
map.put("deviceSubList", deviceSubList);
map.put("networkSubList", networkSubList);
map.put("appSubList", appSubList);
JSONArray jArray=JSONArray.fromObject(map);
response.getWriter().print(jArray);
}