jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动_javascript技巧
May 16, 2016 pm 04:54 PM
下拉菜单
利用struts2和Ajax实现json对象的传输,然后实现菜单的二级联动
下面是我的 js文件原码:
复制代码 代码如下:
var mail={
//初始化
init:{
//初始化数据
initdata:{
did:'',
ttitle:'',
sendpassword:'',
description:''
},
//初始化事件
initevent:{
DataEvent:function(){
$("#did").unbind("change");//获取一级菜单,绑定事件
$("#did").bind("change",function(){
//alert($(this).val());
mail.init.initdata.did=$(this).val();
//alert(mail.init.initdata.did);
mail.init.initevent.getuser();
});
},
<span style="color:#ff0000;">getuser:function(){
$.post("mailAction_showUsers?did=" mail.init.initdata.did,null,function(data){
var uidoption=$("#uid") ;//获取二级菜单
uidoption.empty();//将列表清空
for(var i=0;i<data.users.length;i ){
//向里面填充option,通过循环
uidoption.append("<option value=" data.users[i].uid " >" data.users[i].username "</option>" );
}
});</span>
},
submitCheck:function(){
$("#send").unbind("click");
$("#send").bind("click",function(){
mail.init.initdata.description=$("input[type='textarea']").text();
mail.init.initdata.sendpassword=$("input[name='sendpassword']").val();
mail.init.initdata.ttitle=$("input[name='ttitle']").val();
if(mail.init.initdata.sendpassword==""){
alert("请输入密码!");
return false;
}
else if(mail.init.initdata.ttitle==""){
alert("请输入主题!");
return false ;
}
else if(mail.init.initdata.description==""){
alert("请输入内容!");
return false;
}
else
return true;
});
}
}
}
}
$().ready(function(){
mail.init.initevent.DataEvent();
mail.init.initevent.submitCheck();
});
这是后台的action:
复制代码 代码如下:
private int did;
public String getDid(){
...
}
public void setDid(Strign did){
...
}
public String showUsers(){
users=(ArrayList<User>)this.userService.getUsersByDid(did);
System.out.println(users.size() "...");
return SUCCESS;
}
struts.xml的配置:
复制代码 代码如下:
<package name="users" namespace="/" extends="json-default">
<action name="mailAction_showUsers" method="showUsers" class="mailAction">
<result type="json"></result>
</action>
</package>
前台的jsp页面:
复制代码 代码如下:
<td width="65px">接收人</td>
<td> <s:select list="departmentlist" listKey="did" listValue="dname" id="did" name="did"></s:select>
<s:select list="users" listKey="uid" listValue="username" id="uid" name="uid"></s:select>
</td>
这个是 实现后运行的截图:

写给有需要的人。。。参考参考
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章
仓库:如何复兴队友
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
击败分裂小说需要多长时间?
3 周前
By DDD
公众号网页更新缓存难题:如何避免版本更新后旧缓存影响用户体验?
3 周前
By 王林

热门文章
仓库:如何复兴队友
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
击败分裂小说需要多长时间?
3 周前
By DDD
公众号网页更新缓存难题:如何避免版本更新后旧缓存影响用户体验?
3 周前
By 王林

热门文章标签

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)