网络编程
位置：首页>> 网络编程>> ASP.NET>> 无刷新dropdownlist并进行关联（js+xml)

无刷新dropdownlist并进行关联（js+xml)

作者：小春　来源：zc's blogs　发布时间：2007-09-23 12:13:00　

标签：dropdownlist,无刷新

asp.net的dropdownlist控件为我们的web应用提供了许多用处，但有一点我总感觉不爽的就是在使用dropdownlist的事件是总要要将数据返回到服务端执行（也就是要刷新页面），比如：
二个dropdownlist控件并进行关联。更改dropdownlist1值时同时更新dropdownlist2的内容.
下面是数据库(xml)

<?xml version="1.0" encoding="gb2312"?>
<!-- 拍摄的器材 -->
<imagechina>
  <brand id="1" brandname="Can佳能">
    <name>Eos IDS</name>
    <name>D5</name>
  </brand>
  <brand id="2" brandname="三星">
    <name>F65</name>
    <name>F65</name>
  </brand>
</imagechina>


HTML代码

   <body onLoad="ChooseState()" leftmargin="0" topmargin="0">
<asp:DropDownList onchange="ChooseBrand()" id="brand_id" runat="server"></asp:DropDownList>
<asp:DropDownList id="model_id" runat="server"></asp:DropDownList>
            <script language="JavaScript">
<!--
    function ChooseState()
    {
        var source;
        var sourceName = "brand.xml";
        var source = new ActiveXObject(’Microsoft.XMLDOM’);
        source.async = false;
        source.load(sourceName);
        root = source.documentElement;
        sortField=root.selectNodes("//@brandname");
            for(var i=0;i<sortField.length;++i)
                {
                    var oOption = document.createElement(’OPTION’);
                    oOption.text = " "+sortField[i].text+" ";
                    oOption.value = sortField[i].text;
                    NewOpus.brand_id.options.add(oOption);    
                }
        ChooseCity();
    }
    function ChooseBrand()()
    {
        x=NewOpus.brand_id.selectedIndex;
        y=NewOpus.brand_id.options[x].value;
        sortField=root.selectNodes("//brand[@brandname=’"+y+"’]/name");
        for(var i=NewOpus.model_id.options.length-1;i>=0;--i)
            {
                NewOpus.model_id.options.remove(i)
            }
        for(var i=0;i<sortField.length;++i)
            {
                var oOption = document.createElement(’OPTION’);
                oOption.text = " "+sortField[i].text+" ";
                oOption.value = sortField[i].text;
                NewOpus.model_id.options.add(oOption);    
            }
    }
//-->
            </script>
0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com