jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动_javascript技巧
程序员文章站
2022-04-13 14:49:30
...
利用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();
});
},
getuser:function(){
$.post("mailAction_showUsers?did="+mail.init.initdata.did,null,function(data){
var uidoption=$("#uid") ;//获取二级菜单
uidoption.empty();//将列表清空
for(var i=0;i//向里面填充option,通过循环
uidoption.append("" );
}
});
},
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)this.userService.getUsersByDid(did);
System.out.println(users.size()+"...");
return SUCCESS;
}
struts.xml的配置:
前台的jsp页面:
接收人
这个是 实现后运行的截图:
写给有需要的人。。。参考参考
下面是我的 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();
});
},
getuser:function(){
$.post("mailAction_showUsers?did="+mail.init.initdata.did,null,function(data){
var uidoption=$("#uid") ;//获取二级菜单
uidoption.empty();//将列表清空
for(var i=0;i
uidoption.append("" );
}
});
},
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
System.out.println(users.size()+"...");
return SUCCESS;
}
struts.xml的配置:
复制代码 代码如下:
前台的jsp页面:
复制代码 代码如下:
这个是 实现后运行的截图:
写给有需要的人。。。参考参考