javascript获取select值，树形随着select值的变化而变化

一、javascript获取select值

div部分：

<div class="control-group" >
<label class="control-label">设备类型：</label>
<div class="controls">
<select name="config.type_id" id="type_id" class="required" οnchange="hello(this.options[this.selectedIndex])">
<option></option>
<s:iterator value="device" var="item">
<option value='<s:property value="type_id"/>'<c:if test="${config.type_id == item.type_id}">selected="selected"</c:if>><s:property value="type_name"/></option>
</s:iterator>

</select>

</div>
</div>

<div class="control-group">
<label class="control-label" for="parentConfigId">上级项目：</label>
<div class="controls">
<tags:treeselect id="parentConfig" name="config.config_parentid" notAllowSelectParent="true" notAllowSelectRoot="true" value="${config.config_parentid}" labelName="configName"
labelValue="${fns:getConfigBypId(config.config_parentid).config_name}"
title="项目" url="/a/cfg/configListQuery.action?config.type_id=${config.type_id}"/>

</div>
</div>

js部分：

<script type="text/javascript">
$("#inputForm").validate();
function hello(){

var typeId=document.getElementById("type_id"); //拿到select对象
var index=typeId.selectedIndex; //拿到选中项的索引，selectedIndex代表的是你所选中的index
var t=typeId.options[index].value; //拿到选中项options的value

window.location.href="${ctx}/a/cfg/configPreSave.action?type_id="+t;

}
</script>

二、后台取值

1、首先是xml文件

<action name="configPreSave" class="configAction" method="configPreSave">
<result>/WEB-INF/pages/modules/cfg/configForm.jsp</result>
</action>

2、然后是java代码部分

public String configPreSave(){

try{

this.device=this.configService.deviceTypeLIst(config);

if(type_id!=null && !type_id.equals("")){
config=new Config();
config.setType_id(type_id);
}

}catch(SPMException e){
logger.error(e.getMessage(),e);
}


return SUCCESS;
}

注：如果config对象不new的话，将是空值，type_id也就无法set；deviceTypeLIst就是查询下拉框内的所有数据，具体sql略过

三、最后实现效果和思路讲解

如图中，点击下拉框时候，页面会刷新一下，也就是跳转了页面，后台又跳回到了前台，将type_id也就传了过来，所以树形里面的值就会随着select值的改变而改变。

思路也就是刚才说的那些，选择select值的时候，页面就刷新，否则type_id就无法传过来，树形也就不会随着select值的变化而变化。

四、小结

这个方法虽然看似有些笨重，但是比较好理解。这也是我第一次在CSDN写个人博客，如有写的不对或者不好的地方，欢迎大家指正。

版权声明：本文为博主原创文章，未经博主允许不得转载。