用asp＋javascript实现动态数据联动，不刷新

/////////////by xxrl(孔曰成仁，孟曰取e)
/////////////chinese:蒋健华
/////////////email:jjh_115@eyou.com
联动，联动，联动。。。。困扰了好多网友的神经，在csdn－asp板块中，总是看到网友们大呼救命，救什么？联动！为什么联动这样受到关注，其实用性无可非议，用户也能认可，可是如果数据是大量并相互关联的，那问题就来了，怎么识别并显示是一个很苦恼的问题。那究竟有没有一个很好的解决办法呢？答案是肯定的，因为我们有asp和javascript，哈哈，那么我们就开始行动吧！
我们要获得的数据，既然要达到联动的效果，肯定这些数据是有关联的，那么我们用这样的实例来说明我们的方法
准备条件：
sql server 2000 中文企业版，iis5.0+，ie5.0+，当然，最好有一个好的编辑器，vs.net就不错，当然，如果你是记事本的拥护者，那我也没办法。l
我们以人事管理中的部门级别进行联动方法的说明，认识管理中的部门级别可以这样定义，也是实际企业的定义规则，**化工厂/**系统/**部，举例说明就是
××化工厂/营销系统/市场部，在文中，firstorganization表对应的是”××化工厂”，secondorganization对应的是”营销系统”，thirdorganization对应的是”市场部”

在sql server 2000中新建两个表，或者三个表，为了我们能更大限度的发挥联动的功能，我们建三个表，呵呵。
数据库名称：xxrl_study，用户名xxrl_study,密码xxrl_study
接着建odbc数据源，你也可以不用，但我这样用，呵呵
odbc名：xxrl_ odbc,用用户名xxrl_study，密码xxrl_study连接，指向xxrl_study数据库，默认中文设置，测试――>ok
新建表：
第一个表firstorganization
sql脚本如下：
if exists (select * from dbo.sysobjects where id = object_id(n'[dbo].[firstorganization]') and objectproperty(id, n'isusertable') = 1)
drop table [dbo].[firstorganization]
go

create table [dbo].[firstorganization] (
[id] [int] identity (1, 1) not null ,
[organizationname] [varchar] (100) collate chinese_prc_ci_as not null ,
[description] [varchar] (8000) collate chinese_prc_ci_as null
) on [primary]
go
第二个表secondorganization
sql脚本如下：
if exists (select * from dbo.sysobjects where id = object_id(n'[dbo].[secondorganization]') and objectproperty(id, n'isusertable') = 1)
drop table [dbo].[secondorganization]
go

create table [dbo].[secondorganization] (
[id] [int] identity (1, 1) not null ,
[parentid] [int] not null ,
[organizationname] [varchar] (100) collate chinese_prc_ci_as not null ,
[description] [varchar] (8000) collate chinese_prc_ci_as null ,
[ordernumber] [int] null
) on [primary]
go

第三个表thirdorganization
sql脚本如下：
if exists (select * from dbo.sysobjects where id = object_id(n'[dbo].[thirdorganization]') and objectproperty(id, n'isusertable') = 1)
drop table [dbo].[thirdorganization]
go

create table [dbo].[thirdorganization] (
[id] [int] identity (1, 1) not null ,
[parentid] [int] not null ,
[organizationname] [varchar] (100) collate chinese_prc_ci_as not null ,
[description] [varchar] (8000) collate chinese_prc_ci_as null ,
[ordernumber] [int] null
) on [primary]
go

ok，odbc，我们建好了，数据库也建好了，至于站点的配置，我想大家都应该知道的，这里不再陈述。这里我的站点ip是http://200.100.100.88 （内部网络ip）
终于开始写程序喽，好累，噗哧，噗哧，刚帮我同事搬东西，歇一会儿，coffee-ing……….
好的，为了方便iis他老人家，我们也懒得敲多余的字母，我们是聪明的，不勤劳的程序员，本来程序员就已经够累的了，还不方便我们自己？嘿嘿，赞同者鼓掌，啪啪啪啪，faint，哪来的鞭炮？啥家的小孩也不好好管管。。。。。。。。。j
新建default.asp文件，我们在写如下程序，
建立数据库连接对象，
set objconn=server.createobject("adodb.connection")
objconn.open " xxrl_ odbc ","xxrl_study","xxrl_study"
然后打开我们要进行操作的3个数据集
dim sql1,sql2,sql3
sql1="select * from firstorganization"
sql2 = "select * from secondorganization"
sql3 = "select * from thirdorganization"
‘/////////////////////////打开第一组织库
set rs1=server.createobject("adodb.recordset")
rs1.open sql1,objconn,1,1

set rs2=server.createobject("adodb.recordset")
rs2.open sql2,objconn,1,1

set rs3=server.createobject("adodb.recordset")
rs3.open sql3,objconn,1,1

建一个select类型的http控件，包含在form表单中如下：
‘////////////////////控件的初始值是从firstorganization中读取的，firstorganization在本例子中只有一个数据就是××化工厂代码如下：
<form name=form1 style="margin:0;" method="post">
<select name=firstorganization>
<%
if rs1.recordcount >0 then
response.write"<option value="&rs1(“id”)&”>”&rs1("organizationname")&"</option>"
else
response.write "没有配置"
end if
%>
</select>
</form>
好，这就是我们的联动功能的头
下面我们要建立第二个select控件了，第二个select控件中，我们用到了onchange函数，关于这个函数的详细解释，请看msdn。代码如下(包含在form中)：
<select name=secondorganization onchange=”changelocationi(form1.secondorganization.options[form1.secondorganization.selectedindex].value);”>
<option value=””>-------------</option>
<%
if rs2.recordcount<0 then
response.write “<option value=””””>库中没有部门！</option>”
else
while not rs2.eof
response.write “<option value=”&rs2(“id”)&”>” &rs2(“organizationname”)&”</option>”
rs2.movenext
wend
end if
%>
</select>
ok,第二个也搞定，下面我们来建立第三个select 同样放在form表单里，如下：
<select name=thirdorganization>
</select>
不要忘记关数据集噢，
rs1.close
set rs1 = nothing
rs2.close
set rs2 = nothing
rs3.close
set rs3 = nothing
ok，页面元素全部准备就绪，下面开始我们真正的联动之旅。
本例子采用asp和javascript交互的方法取数据库中的数据，由于我们在form表单前我们新建script脚本快，由于要交互，所以我们要这么写才能很好的交互
<%=”<script language=javascript>”%>
</script>
然后我们就可以在script块中书写我们的程序了。
我们的基本操作是根据二级下拉中得出三级下拉，二级我们都从数据库中取出来了，下面我们要取三级组织的数据了，如下
<%=”<script language=javascript>”%>
<%’asp块
dim sql_getthirdorganization
sql_getthirdorganization = "select * from thirdorganization order by id desc"
set rs_getthirdorganization = server.createobject("adodb.recordset") rs_getthirdorganization.open sql_getthirdorganization,objconn,1,1
%>
var temp,temp_2;//////////////javascript块
temp=0;///////////////////for循环变量初始化
related = new array();//////////////////////数组，用来存放三级组织的id，名称，和对应的父id
<%
temp_2 = 0 ‘一个临时变量，用来存放三级组织的个数
while not rs_getthirdorganization.eof ‘循环第三级组织
%>
////////////三维分别对应的第三级组织的id，第三级组织的名称
////////////第三级别组织的父id（即第二级别id）
related[<%=temp_2%>] = new array("<%=rs_getthirdorganization(“id”)%>","<%=rs_getthirdorganization(“organizationname”)%>","<%=rs_getthirdorganization(“parentid”)%>");
<%
temp_2 = temp_2 + 1
rs_getthirdorganization.movenext
wend
%>
temp = <%=temp_2%>;
function changelocation(id){ ////
var id = id; 接受二级菜单的选择的item的索引值
document.form1.thirdorganization.length=0; //初始化第三级菜单的长度，下标从0开始
var i = 0;
/////////////////初始化第三级菜单的text和value属性的值，第一个参数值是text ”--------”,二是////////value 空值
document.form1.thirdorganization.options[0]=new option('-------',');
////////////循环数组，用数组的第三维数（父id）和函数传过来的数进行比较
for(i=0;i< temp;i++){
if(related[i][2]==id){ /////////如果相等，证明在第三级里面有输入第二级组织的子集
///////////////////并将子集（第三级）的值赋给第三个select，
document.form1.thirdorganization.options[document.form1.thirdorganization.length] = new option(related[i][1], related[i][0]);
}
}
}
</script>
最后在页面的最后可不要忘了添加objconn.close噢，呵呵
上面介绍的东西，主要是根据选择第二个select来联动第三个select,那么如果我们在第三个select控件处这样再定义一个函数如下：
<select name=thirdorganization onchange=”fnchangeagain(form1.thirdorganization.options[form1.thirdorganization.selectedindex].value)”>
</select>
这样，再在script块中再写一个同样的函数，函数内容同changelocation函数，是不是实现了三级联动，那么依此类推，呵呵，10级别联动都可以做，只不过麻烦而已，当然，你也可以用其他的方法，或者用一个表来对应算法，这随便你，我这例子也是从我实际开发中得来的一点经验积累，主要是为了思路清晰，为不懂程序的人好维护，所以将组织分开，因为鄙人从不维护，嘿嘿。
夏天要过去了，呵呵，祝大家安康！祝未来的中秋佳节开心，我又要一个人在外地过喽。
xxrl(孔曰成仁，孟曰取e)
2003-8-26<