[AjaxPro.AjaxMethod] public DataTable GetArea(int parentid) { //----- }
步骤二:
在ASPX页面上放三个dropdownlist控件
给前两个控件添加onchange="loaddata(this,控件ID)"
步骤三:
写AJAX代码
<script language=javascript> var targetid; function loaddata(obj,targetobj) ...{ targetid = targetobj; var areaid = obj.options[obj.selectedIndex].value;//取得选中编号 WebClass.Classlist.GetArea(areaid,result_CallBack);//获取子分类 } function result_CallBack(response) ...{ if(response.value!=null) ...{ var dt = response.value;//.Tables[0]; if(dt!=null) ...{ document.getElementById(targetid).length=0;//清空 for(var i=0; i<dt.Rows.length; i++) ...{ var name=dt.Rows[i].areaname; var id=dt.Rows[i].areaid; document.getElementById(targetid).options.add(new Option(name,id)); } } } } </script>
数据库
CREATE DATABASE Class go CREATE TABLE Area ( areaId int identity(1,1) primary key, areaName varchar(100), parentId int ) go insert into Area(areaname,parentId) values('省A',0) insert into Area(areaname,parentId) values('省B',0) insert into Area(areaname,parentId) values('市1',1) insert into Area(areaname,parentId) values('市2',1) insert into Area(areaname,parentId) values('市3',2) insert into Area(areaname,parentId) values('市4',2) insert into Area(areaname,parentId) values('市1县1',3) insert into Area(areaname,parentId) values('市1县2',3) insert into Area(areaname,parentId) values('市2县1',4) insert into Area(areaname,parentId) values('市2县2',4) insert into Area(areaname,parentId) values('市3县1',5) insert into Area(areaname,parentId) values('市3县2',5) insert into Area(areaname,parentId) values('市4县1',6) insert into Area(areaname,parentId) values('市4县2',6) GO CREATE PROC pro_sns_area_Select ( @areaId int ) as select areaid,areaname from Area where parentId = @areaId