=========================== ajax +struts2 动态加载 select option ==============================
1、jsp定义:
为jsp界面的select添加id,例如:部门、员工状态的下拉框
<tr>
<td width="20%" height="30px;" align="right">所在部门:</td>
<td width="30%">
<select id="depttype" name="employeeBean.deptcd"></select>
</td>
<td width="20%" height="30px;" align="right">状态:</td>
<td width="30%">
<select id="empstate" name="employeeBean.status"></select>
</td>
</tr>
2、调用js函数,利用ajax调用action处理数据,参数采用数组的方式传递(select的ID)
//动态加载select option
var eunm = Array();
eunm.push('depttype');
eunm.push('empstate');
utilqueryEnums(eunm.join(">"));
3、js函数定义
/**
* 动态加载select
* @param obj selectID数组
* @return
*/
function utilqueryEnums(obj){
var option = {
url :"utilqueryEnums.action?data="+obj,
type :"get",
dataType :"json",
timeout :20000,
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
},
success :function(json){
if(obj.length > 1){
obj = obj.split('>');
for(var i = 0;i<obj.length;i++){
if(null != obj[i] || "" != obj[i] || "undefined" != obj[i] ){
document.getElementById(obj[i]).options.length=0;
var datas = json.message;
//将字符串转换为对象,js内置方法
datas = eval(datas);
document.getElementById(obj[i]).options.add(new Option("",""));
var selectObj = document.getElementById(obj[i]);
var data = datas[i];
for( var y = 0; y < data.length; y++) {
selectObj.options.add(new Option(data[y].paraname,data[y].paraid));
}
}
}
}else{
document.getElementById(obj).options.length=0;
var datas = json.message;
//将字符串转换为对象,js内置方法
datas = eval(datas);
document.getElementById(obj).options.add(new Option("",""));
for ( var i = 0; i < datas.length; i++) {
document.getElementById(obj).options.add(new Option(datas[i].paraname,datas[i].paraid));
}
}
}
};
$("form").ajaxSubmit(option);
}
4、后台action数据处理
---------------------------- service : ----------------------------
public interface IEnumerationService {
public List<Enumeration> queryEnumByParakind(String parakind);
}
---------------------------- serviceimpl: ----------------------------
@Service
public class EnumerationServiceImpl implements IEnumerationService{
@Autowired
private IBaseDao baseDao;
public List<Enumeration> queryEnumByParakind(String parakind) {
String hql = "from Enumeration e where e.parakind = ?";
List<Enumeration> enums = baseDao.queryEntitys(hql,new Object[]{parakind});
return enums;
}
}
---------------------------- action :-------------------------------------
public class EnumerationAction extends ActionSupport{
/**
*
*/
private static final long serialVersionUID = -5708391673823472363L;
@Autowired
private IEnumerationService enumerationservice;
private String message = "";
private String data;
public String queryEnums() throws JSONException{
String[] str = data.split(">");
List list1 = new ArrayList();
List<Enumeration> list = null;
if(str.length > 1){
for (int i = 0; i < str.length; i++) {
list = enumerationservice.queryEnumByParakind(str[i]);
list1.add(list);
}
message = JSONUtil.serialize(list1);
}else{
list = enumerationservice.queryEnumByParakind(str[0]);
message = JSONUtil.serialize(list);
}
return SUCCESS;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
public String getData() {
return data;
}
public void setData(String data) {
this.data = data;
}
}
5、数据字典设计
create table ENUMERATION
(
ENUMERATIONKY NUMBER not null,
PARAKIND VARCHAR2(30),
PARAID VARCHAR2(20),
PARANAME VARCHAR2(30)
)
6、测试数据
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (6, 'depttype', '900051', '总经理办公室', 'AAAMomAAEAAAAFsAAA');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (7, 'depttype', '900052', '市场部', 'AAAMomAAEAAAAFsAAB');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (8, 'depttype', '900053', '财务部', 'AAAMomAAEAAAAFsAAC');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (9, 'depttype', '900054', '人力资源部', 'AAAMomAAEAAAAFsAAD');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (10, 'depttype', '900055', '保安部', 'AAAMomAAEAAAAFsAAE');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (11, 'depttype', '900056', '后勤部', 'AAAMomAAEAAAAFsAAF');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (1, 'empstate', '900001', '在职', 'AAAMomAAEAAAAFsAAG');
insert into enumeration (ENUMERATIONKY, PARAKIND, PARAID, PARANAME, ROWID)
values (2, 'empstate', '900002', '离职', 'AAAMomAAEAAAAFsAAH');
分享到:
相关推荐
jquery Ajax实现Select动态添加数据,具体内容如下 1.背景 最近在工作中,遇到了一个关于select的问题。一般情况下,select下拉框中的数据都是固定的或者直接在jsp中读取列表值显示。但是,这次要实现select与别的...
现在项目中的select需要根据不同的场景使用不同的数据,解决方式就是动态加载option数据。 代码部分: 下面步骤介绍了如何从数据库获取数据,并动态的在前端显示。 步骤一:jsp页面静态的select: <select id=...
这里主要是添加了它的特有属性并调用 class=”chzn-select”: jsp页面: <select class=”chzn-select” id="CODE" name="CODE"> ...... </select> js页面: $(".chzn-select").chosen(); 注意...
—加载httpRequest请求返回的文本(即data.jsp),如红色字体所示代码 --> </body> </html> data.jsp页面的主要内容 <body> <td> 部门名称 被评人/评分人 ${fromEmps}"> ${...
在jsp页面使用”<!– –>”的注释,注释里面的java代码还是会得到执行,可以再查看页面源代码上看到执行完成的内容,这样就会让不希望执行的代码得到执行,影响加载速度。比如如下代码: 代码如下: 性别:<...
C)<option> D)<select name="NAME"></select> 1、HTML的全称是什么?HTML语言是什么? 答:HTML(HyperText Markup Language)的中文名称为“超文本描述语言”,是一种专门用来设计网页的计算机语言,用HTML编写的超...
[removed]=function() {//页面加载时的函数 } function Change_Select(){//当第一个下拉框的选项发生改变时调用该函数 var province = document.getElementById(‘province’).value; var url =
1.如果是在jsp 中: <html:regionselect></html:regionselect> 2.如果是在Freemarker的html中: RegionSelect= "com.enation.app.base.component.widget.regions.RegionSelectDirective"?new()> ...
select标签 13.9.8. option标签 13.9.9. options标签 13.9.10. textarea标签 13.9.11. hidden标签 13.9.12. errors标签 13.10. 处理异常 13.11. 惯例优先原则(convention over configuration) 13.11.1. 对控制器的...
6.8.4. 在Spring应用中使用AspectJ加载时织入(LTW) 6.9. 更多资源 7. Spring AOP APIs 7.1. 简介 7.2. Spring中的切入点API 7.2.1. 概念 7.2.2. 切入点运算 7.2.3. AspectJ切入点表达式 7.2.4. 便利的切入...
6.8.4. 在Spring应用中使用AspectJ加载时织入(LTW) 6.9. 更多资源 7. Spring AOP APIs 7.1. 简介 7.2. Spring中的切入点API 7.2.1. 概念 7.2.2. 切入点运算 7.2.3. AspectJ切入点表达式 7.2.4. 便利的切入...
{1.4}数据类型}{23}{section.1.4} {1.4.1}整数与浮点数}{23}{subsection.1.4.1} {1.4.1.1}浮点数原理}{24}{subsubsection.1.4.1.1} {1.4.2}格式化输出浮点数}{24}{subsection.1.4.2} {1.4.3}\texttt {char}}{24...
Select Case Request("page") Case "img" Call Page_Img() Case "css" Call Page_Css() Case "loginchk" Call LoginChk() Case "logout" Call Logout() Case Else: '"一夫当关,万夫莫开"——用户验证 If ...