Dropdownlist无刷新联动问题

chilam1988 2010-11-16 02:07:34
为实现Dropdownlist无刷新联动 从网上找的方法实现不来，各位帮忙看下。

主页面


<head runat="server">

    <title>XXXXX</title>

   

   <script type="text/javascript">

function load(DepID){           //ClassID为接收传递的大类编号

    var drp2 = document.getElementById("DropDownList2");

    function RemoveAll(oElem) {             //清除DropDownList2的所有项

    var i = 0;

    for (i = oElem.length; i >= 0; i--){

        oElem.options.remove(i);

        }

    }

    RemoveAll(drp2)

    //新建一请求与XML文档

    var oHttpReq = new ActiveXObject("MSXML2.XMLHTTP");

    var oDoc = new ActiveXObject("MSXML2.DOMDocument");

    oHttpReq.open("POST", "DropChild.aspx?DepID="+DepID, false);   //调用读取小类数据的页面，将大类编号值传递过去

    oHttpReq.send("");

    result = oHttpReq.responseText;

    

    oDoc.loadXML(result);

    alert(oDoc.xml);  

    items1 = oDoc.selectNodes("//airline/Table");   //读取所有请求大类所属小类的类名//不知何意？

    items2 = oDoc.selectNodes("//airline/Table"); //读取所有请求大类所属小类的编号    

   

    var itemsLength=items1.length;

    for(i=0;i<itemsLength;i++)            //将小类的类名和编号赋予DropDownList2                                                   

    {

        var newOption = document.createElement("OPTION");

        newOption.text=items1[i].text;

        newOption.value=items2[i].text;

        drp2.options.add(newOption);

    }

   

}

</script> 

</head>

<body MS_POSITIONING="flowLayout">

<form id="Form1" method="post" runat="server">

<asp:DropDownList id="DropDownList1" runat="server"></asp:DropDownList>

<asp:DropDownList id="DropDownList2" runat="server"></asp:DropDownList>

<asp:TextBox id="TH" runat="server" BorderStyle="None" ForeColor="White" BorderColor="White"></asp:TextBox>

<asp:Label id="Label1" runat="server"></asp:Label>

<asp:Button id="Button1" runat="server" Text="Button"></asp:Button>

</form>

</body>

</html>

该页后台


Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        Dim objGeo As New GeoInfos

        Dim StateDataSet As DataSet = objGeo.getAllAirline

        With Me.DropDownList1

            If Not StateDataSet Is Nothing AndAlso StateDataSet.Tables.Count > 0 Then

                .DataSource = StateDataSet

                .DataTextField = "description"

                .DataValueField = "code"

                .DataBind()

            End If



            .Items.Insert(0, New ListItem("-", ""))

        End With



        Me.DropDownList1.Attributes.Add("onchange", "load(this.options[this.selectedIndex].value)")

        Me.DropDownList2.Attributes.Add("onChange", "javascript:document.Form1.TH.value=this.options[this.selectedIndex].value;")

    End Sub


方法页面
 Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

      

        Dim state As String = Request.QueryString("DepID")

        Dim con As SqlConnection = New SqlConnection("")

        Dim da As SqlDataAdapter = New SqlDataAdapter("select distinct ap,al from ail where ap='" + state + "'", con)

        Dim ds As DataSet = New DataSet("mydst")

        da.Fill(ds, "mydst")



        Dim writer As XmlTextWriter = New XmlTextWriter(Response.OutputStream, Response.ContentEncoding)

        writer.Formatting = Formatting.Indented

        writer.Indentation = 4

        writer.IndentChar = ""

        writer.WriteStartDocument()

        ds.WriteXml(writer)

        writer.Flush()

        Response.End()

        writer.Close()



    End Sub


希望各位不吝赐教
...全文
106 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
孟子E章 2010-11-26
  • 打赏
  • 举报
 回复
最好ajax直接请求最终的结果，如option节点信息，而不是获得xml内容再客户端实现
lingxuch 2010-11-25
  • 打赏
  • 举报
 回复
楼主问题应说清楚点，比如哪里不能实现，报什么错，
hch126163 2010-11-25
  • 打赏
  • 举报
 回复
你的代码即使逻辑正确，也是IE only!
hch126163 2010-11-25
  • 打赏
  • 举报
 回复
自己调试一下
shaoliang520xi 2010-11-16
  • 打赏
  • 举报
 回复
//获取国家信息
function GetCountryList<%=DivName %>()
{
$.ajax({
type:"Post",
url:"<%=BLL.Config.root %>ProAjax/Clearing/GetCountry.aspx",
data:"",
success:function (msg){
var datalist=eval(msg);
for(var i=0;i<datalist.length;i++){
var key=datalist[i][0];
var value=datalist[i][1];
$("<option value="+value+">"+key+"</option>").appendTo($("#ddlCountry<%=DivName %>"));
}
$("<option value=''>其他国家或地区</option>").appendTo($("#ddlCountry<%=DivName %>"));
$("#ddlCountry<%=DivName %>").val(35);
GetProvinceById<%=DivName %>();
}
})
}
//通过国家ID获取省份列表信息
function GetProvinceById<%=DivName %>(){
var CountryID=$("#ddlCountry<%=DivName %>").val();
$("#ddlprovince<%=DivName %>").html("");
if(CountryID==""){
//其他国家或地区
$("#ddlprovince<%=DivName %>").css("display","none");
$("#ddlCity<%=DivName %>").css("display","none");
$("#ddlarea<%=DivName %>").css("display","none");
}else{
//选择了国家
$("#ddlprovince<%=DivName %>").css("display","");
$("#ddlCity<%=DivName %>").css("display","");
$("#ddlarea<%=DivName %>").css("display","");
var datalist="cid="+CountryID;
$.ajax({
type:"Post",
url:"<%=BLL.Config.root %>ProAjax/Clearing/GetProvinceList.aspx",
data:datalist,
success:function(msg){
if(msg!=""){
//有省份
var datalist=eval(msg);
for(var i=0;i<datalist.length;i++){
var key=datalist[i][0];
var value=datalist[i][1];
$("<option value="+value+">"+key+"</option>").appendTo($("#ddlprovince<%=DivName %>"));
}
$("<option value=''>请选择省份</option>").prependTo($("#ddlprovince<%=DivName %>"));
$("#ddlprovince<%=DivName %>").val("");
}else{
//无省份
$("<option value=''>请选择省份</option>").appendTo($("#ddlprovince<%=DivName %>"));
$("#ddlCity<%=DivName %>").html("");
$("<option value=''>请选择城市</option>").appendTo($("#ddlCity<%=DivName %>"));
$("#ddlarea<%=DivName %>").html("");
$("<option value=''>请选择县区</option>").appendTo($("#ddlarea<%=DivName %>"));

}
}
})
}
}

//通过省份获取城市列表
function GetCityById<%=DivName %>(){
var provinceId=$("#ddlprovince<%=DivName %>").val();
$("#ddlCity<%=DivName %>").html("");
if(provinceId==""){
//无,请选择省份
$("<option value=''>请选择城市</option>").appendTo($("#ddlCity<%=DivName %>"));
}else{
//有选择了省份
var datalist="pid="+provinceId;
$.ajax({
type:"Post",
url:"<%=BLL.Config.root %>ProAjax/Clearing/GetCityList.aspx",
data:datalist,
success:function(msg){
if(msg!=""&&msg!="[]"){
//有城市
var datalist=eval(msg);
for(var i=0;i<datalist.length;i++){
var key=datalist[i][0];
var value=datalist[i][1];
$("<option value="+value+">"+key+"</option>").appendTo($("#ddlCity<%=DivName %>"));
}
$("<option value=''>请选择城市</option>").prependTo($("#ddlCity<%=DivName %>"));
$("#ddlCity<%=DivName %>").val("");
$("#ddlarea<%=DivName %>").html("");
$("<option value=''>请选择县区</option>").appendTo($("#ddlarea<%=DivName %>"));
}else{
//无城市
$("<option value=''>请选择城市</option>").appendTo($("#ddlCity<%=DivName %>"));
$("#ddlarea<%=DivName %>").html("");
$("<option value=''>请选择县区</option>").appendTo($("#ddlarea<%=DivName %>"));
}
}
})
}
}


//通过城市获取县区列表
function GetArea<%=DivName %>(){
var cityId=$("#ddlCity<%=DivName %>").val();
$("#ddlarea<%=DivName %>").html("");
if(cityId==""){
//无，请选择城市
$("<option value=''>请选择县区</option>").appendTo($("#ddlarea<%=DivName %>"));
}else{
//有选择城市
var datalist="citycode="+cityId;
$.ajax({
type:"Post",
url:"<%=BLL.Config.root %>ProAjax/Clearing/GetAreaList.aspx",
data:datalist,
success:function(msg){

if(msg!=""&&msg!="[]"){
//有县区
var datalist=eval(msg);
for(var i=0;i<datalist.length;i++){
var key=datalist[i][0];
var value=datalist[i][1];
$("<option value="+value+">"+key+"</option>").appendTo($("#ddlarea<%=DivName %>"));
}
$("<option value=''>请选择县区</option>").prependTo($("#ddlarea<%=DivName %>"));
$("#ddlarea<%=DivName %>").val("");
}else{
//无县区
$("<option value=''>请选择县区</option>").appendTo($("#ddlarea<%=DivName %>"));
}
}
})
}
}
ajax.dll 实现DropDownList无刷新联动
这个是ajax 实现DropDownList无刷新联动。里面有数据库结构和内容，表结构的是sql2000的， 关键代码： <SCRIPT language="javascript"> //城市------------------------------ function cityResult() ...
DropDownList无刷新三级联动
DropDownList无刷新三级联动 caomianpublic void getDdlInfo(DropDownList province,DropDownList city,DropDownList town,Page myPage) { //初始化省 string sql="select 序号,省名 from 省表"; SqlCommand ...
DropDownList年月二级联动无刷新
年月两级联动无刷新。年月显示最近十年数据。文件形式为.net用户控价下载后直接导入到项目后用法同用户控件用法。很方便
无刷新二级联动dropdownlist菜单.rar
无刷新二级联动dropdownlist菜单.rar
DropDownList无刷新二级联动控件
DropDownList无刷新二级联动控件，通过ClientScript.GetCallbackEventReference实现了无刷新联动。支持样式，视图状态的保存。并将DropDownList的回发操作封装到事件中。使用控件就像使用一般的DropDownList服务器...
Ajax

52,797

社区成员

25,305

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 Ajax
社区管理员
  • Ajax
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章