请问如何实现根据选择的下拉菜单值动态从类中获取信息再设置在到文本框中?

请问如何实现根据选择的下拉菜单值动态从类中获取信息再设置在到文本框中?

问题描述:

jsp页面中有一下拉列表,想实现如下功能,根据选中的下拉项,用该下拉项的下标索引作为key从一个自定义容器中获取相应值并设置到后续的text文本框中。

举例:
<select id="AA" onchange="setInfo()">
    <option value=‘1’>李</option>
    <option value=‘2’>王</option>
</select>
<!-- 此处的option也是动态生成,事先是不知道个数的,为了方便举例我简单用两个代替了-->

<input type="text" name="age">
<input type="text" name="sex">

现在我选中李,页面就从一个自定义的类UserInfo(所有需要的用户信息已经全部从服务端返回并封装了)中以“李”作为key获取“李”的age,sex等信息,并显示在text文本框中,这个js怎么写?

我写的setInfo()是
var slt = document.getElementById("AA");
var id = slt.value;

//userInfo为UserInfo类的实例变量
document.all.age.value = <%=userInfo.getUserInfo(id, "age")%>;//获取age(id实际无法调用,举例用)
document.all.sex.value = <%=userInfo.getUserInfo(id, "sex")%>;//获取sex(id实际无法调用,举例用)

但是因为在java代码中无法调用js变量,所以程序写不下去了,谁有解决方法吗?

UserInfo的存储结构如下:
整个是个arraylist,里面存放了N条记录,每条记录再用HashMap格式存放,具体为
{id=1,name="李",age=10,sex="男"}
{id=2,name="钱",age=20,sex="男"}
{id=3,name="王",age=30,sex="女"}
.......略

 

只要能够获取到下拉菜单的索引下标id值并传到java的代码中就可以了,问题是怎么传呢?要是这种方法不能实现,那又该怎么实现呢?

 


问题补充:
一楼这位的方法我尝试过,可惜无法实现,因为这个下拉菜单也是动态生成的,要获取这个下拉菜单的id索引就一定要在js中,再要设值就需要把刚才js获取的id用上,然后在java代码中实现,这样又回到老问题了
问题补充:
ajax我也想过 但是处理的url很难实现,页面是用servlet控制的,不能简单传个下标索引过去,要改动不少的地方工程也很大。而且主要是我所需要的信息都已经返回并封装在userInfo这个类中了,我就是获取不到id,使用ajax好像有点大材小用了
问题补充:
如果我把返回的类改成了HashMap形式,但是要取出里面的value值还是需要hashmap.get(id)这种形式的吗?不好意思,我有些不明白,这个id不就是我从页面上的获取的下拉菜单下标索引吗?这样不是仍然无法解决js和java代码混合调用的问题?

如果前台需要和服务器动态交互肯定要用ajax,推荐使用dwr,前台直接可以调用后台java方法。按你的需求监听select的onchange事件,向服务器端发送请求,返回所需数据,最后在回调函数里设置到后续的text文本框中即可.

你可以把在页面中构建一个js对象,代表后台UserInfo的java对象啊,
就拼装字符串,

比如<%="var userInfo=[...]" %>,
这样拼装好这个js对象,那setInfo()方法里就可以直接用这个js对象了嘛

那你就应该setInfo()方法里用ajax请求去动态获取数据才对,

你改下后台,不要返回arraylist,返回hashmap嘛,以id为key,{id=1,name="李",age=10,sex="男"} 这样的map为value,包装下,
那不就可以得到key了嘛

你这么写



setInfo(oSel)是
//var slt = document.getElementById("AA");
//这样就能得到正确的id了
var id = oSel.options[oSel.selectedIndex].value;

//userInfo为UserInfo类的实例变量
document.all.age.value = <%=userInfo.getUserInfo(id, "age")%>;//获取age(id实际无法调用,举例用)
document.all.sex.value = <%=userInfo.getUserInfo(id, "sex")%>;//获取sex(id实际无法调用,举例用)