Jquery 实现级联下拉菜单
1、JavaScript：一级下拉列表框的实现
function show_hnbInfo()
{
var ss = Math.random();
$.ajax(
{
type : 'POST',
url : 'getAllHnbInfo',
data : 'id=' + ss,
success : function(msg)
{
// 清空表格
$("#internetID").empty();
// 转换成json对象
var data = JSON.parse(msg);
var option = "<option value=\"\">请选择...</option>";
// 循环组装下拉框选项
$.each(data, function(k, v)
{
option += "<option value=\"" + v['internetID'] + "\">" + v['hnbName'] + "</option>";
});
$("#internetID").append(option);
$("#internetID").change(function()
{
show_freqHnbInfo($(this).val());
});
},
error : function(msg, textStatus, e)
{
alert("当前登录用户失效，请重新登录。");
window.location = path + "/login.jsp";
}
});
}2、JavaScript：二级下拉列表框的实现
function show_freqHnbInfo(internetId)
{
var ss = Math.random();
$.ajax(
{
type : 'POST',
url : 'getAllHnbOnlineOutByOne',
data : 'id=' + ss + '&internetId=' + internetId,
success : function(msg)
{
// 清空表格
$("#internetId").empty();
// 转换成json对象
var data = JSON.parse(msg);
var option = "";
// 循环组装下拉框选项
$.each(data, function(k, v)
{
option += "<option value=\"" + v['internetID'] + "\">" + v['hnbName'] + "</option>";
});
if (internetId == "" || internetId == null || internetId == undefined)
{
option += "<option value=\"\">请选择...</option>";
}
$("#internetId").append(option);
},
error : function(msg, textStatus, e)
{
alert("当前登录用户失效，请重新登录。");
window.location = path + "/login.jsp";
}
});
}3、JSP代码实现
<script type="text/javascript" src="${pageContext.request.contextPath}/script/config/freqCell.js"></script>
<script type="text/javascript">
var type = "${type }";
var path = "${pageContext.request.contextPath}";
show_hnbInfo();
show_freqHnbInfos();
</script>
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" class="borderquan">
<tr>
<td width="25%" height="30" align="center" class="borderbottomright">基站名称</td>
<td width="75%" class="borderbottom"><label>
<select name="internetID" id="internetID" style="width:318px">
<option value="">请选择...</option>
</select>
<FONT SIZE="" COLOR="red">*</FONT>
<input type="hidden" name="type" id="type" value="${type }">
<span id="staError" style="font-size: 9pt; font-family: 黑体; color: red"></span>
</label></td>
</tr>
<tr>
<td width="25%" height="30" align="center" class="borderbottomright"><c:if test="${type=='intra' }">同频</c:if><c:if test="${type=='inter' }">异频</c:if>邻基站名称</td>
<td width="75%" class="borderbottom"><label>
<select name="internetId" id="internetId" style="width:318px">
<option value="">请选择...</option>
</select>
<FONT SIZE="" COLOR="red">*</FONT>
<span id="staErrors" style="font-size: 9pt; font-family: 黑体; color: red"></span>
</label></td>
</tr>
<tr>
<td height="30" colspan="2" align="center">
<input type="button" name="save" class="myBtn" value="保 存" onclick="submitForm();" />
<input type="button" name="backtrack" class="myBtn" value="返 回" onclick="goback();"/>
</td>
</tr>
</table>4、后台代码：controller
@RequestMapping("/getAllHnbInfo")
public void getAllHnbByJosn(HttpServletRequest request, HttpServletResponse response)
{
PrintWriter out = null;
try
{
// 设置输出格式
response.setContentType("text/html");
// 页面输出对象
out = response.getWriter();
out.write(hnbService.getAllHnbByJosn());
out.flush();
out.close();
}
catch (Exception e)
{
logger.error(Global.LOG_EXCEPTION_NAME, e);
if (null != out)
{
out.write("[]");
out.flush();
out.close();
}
}
}
/**
* <获取所有基站名称和基站标识返回josn串>
* <功能详细描述>
* @param request
* @return
* @see [类、类#方法、类#成员]
*/
@RequestMapping("/getAllHnbOnlineOutByOne")
public void getAllHnbOnlineOutByOne(HttpServletRequest request, HttpServletResponse response)
{
PrintWriter out = null;
try
{
String internetId = request.getParameter("internetId");
// 设置输出格式
response.setContentType("text/html");
// 页面输出对象
out = response.getWriter();
out.write(hnbService.getAllHnbOnlineOutByOne(internetId));
out.flush();
out.close();
}
catch (Exception e)
{
logger.error(Global.LOG_EXCEPTION_NAME, e);
if (null != out)
{
out.write("[]");
out.flush();
out.close();
}
}
}
}5、后台代码：service代码
@Override
public String getAllHnbByJosn()
{
List<HnbInfo> hnbList = getHnbOnlineList();
if (null != hnbList)
{
StringBuffer sb = new StringBuffer();
sb.append("[");
//得到集合的长度
int size = hnbList.size();
int i = 0;
for (HnbInfo hnbInfo : hnbList)
{
i++;
String internetID = hnbInfo.getInternetID();
String hnbIdentifier = hnbInfo.getHnbIdentifier();
String hnbName = hnbInfo.getHnbName();
sb.append("{\"internetID\":\"");
sb.append(internetID);
sb.append("\",\"hnbIdentifier\":\"");
sb.append(hnbIdentifier);
sb.append("\",\"hnbName\":\"");
sb.append(hnbName);
sb.append("\"}");
//如果i小于size字符串sb中加","
if (i < size)
{
sb.append(",");
}
}
sb.append("]");
//拼好的字符串赋值给变量
return sb.toString();
}
else
{
return "[]";
}
}
@Override
public String getAllHnbOnlineOutByOne(String internetId)
{
// 根据基站ID 获取基站信息
InternetGatewayDevice internet = hnbDao.getOneHnbByInternetID(internetId);
if (null != internet && !Global.isEmpty(internet.getApIpAdress()))
{
// 根据基站注册IP地址获取所有除基站注册IP地址对应的基站外的所有基站
List<HnbInfo> hnblist = getAllHnbOutByone(internet.getApIpAdress());
if (null != hnblist && hnblist.size() != 0)
{
StringBuffer sb = new StringBuffer();
sb.append("[");
//得到集合的长度
int size = hnblist.size();
int i = 0;
for (HnbInfo hnbInfo : hnblist)
{
i++;
String internetID = hnbInfo.getInternetID();
String hnbIdentifier = hnbInfo.getHnbIdentifier();
String hnbName = hnbInfo.getHnbName();
sb.append("{\"internetID\":\"");
sb.append(internetID);
sb.append("\",\"hnbIdentifier\":\"");
sb.append(hnbIdentifier);
sb.append("\",\"hnbName\":\"");
sb.append(hnbName);
sb.append("\"}");
//如果i小于size字符串sb中加","
if (i < size)
{
sb.append(",");
}
}
sb.append("]");
//拼好的字符串赋值给变量
return sb.toString();
}
else
{
return "[]";
}
}
else
{
return "[]";
}
} 相关推荐
SAMXIE 2020-11-04
李永毅 2020-06-21
xiaoxiaoCNDS 2020-06-04
CoderJiang 2020-04-22
CloudXli 2020-04-20
LonelyTraveler 2020-03-03
TheBigBlue 2020-02-20
tianchaoshangguo 2020-02-19
xcznb 2020-02-13
momode 2012-08-27
mapdigit 2013-05-13
云之高水之远 2020-01-10
nangongyanya 2019-12-30
sdwylry 2019-12-17
jackalwb 2019-12-08
nimeijian 2019-12-07
pfjia 2019-12-04