zoukankan      html  css  js  c++  java
  • 使用XMLDataSource简单实现多级下拉菜单

    以前用asp的时候写过多级关联的下拉菜单,比如大类别、小类别,选择省份、显示城市等,那时候要用Javascript写个函数,论效率应该比XMLDataSource高,页面也不用返回服务器。今天把省份城市乡镇写成XML,用XMLDataSource绑定asp:DropDownList为了尝尝鲜。

        我这中间还有个插曲。在网上找了很长时间,都没有找到。竟然没有中国省份城市的XML文档,我晕,难道我自己写啊,省份31个,下面的城市,县城??。最后找到国家统计局的网站,有2005最新的行政划分,只有HTML格式的,用XSL转?还不会(别鄙视,那个网页也很不标准)。保存成文本,一行行改?太累了。找个工具吧?txt2xml?开源社区有一个,好不容易找到链接down下来,发现必须装JDK。MD,就没有个exe程序啊!面对那3000多行的文本,我怎么整理成XML啊,郁闷。当时就想,我要是开发个简单的txt2xml或许也能火起来,哈哈,不错的工具。或许很有难度的说。此事日后再议!

         1. 有自己的XML了。格式如下:

    <?xml version="1.0" encoding="utf-8" standalone="yes" ?>
    <China>
      
    <Province Name="北京市" PostalCode="110000">
        
    <City Name="市辖区" PostalCode="110100">
          
    <county Name="东城区" PostalCode="110101"/>
          
    <county Name="西城区" PostalCode="110102"/>
          
    <county Name="崇文区" PostalCode="110103"/>
          .
          
    <county Name="怀柔区" PostalCode="110116"/>
          
    <county Name="平谷区" PostalCode="110117"/>
        
    </City>
        
    <City Name="县" PostalCode="110200">
          
    <county Name="密云县" PostalCode="110228"/>
          
    <county Name="延庆县" PostalCode="110229"/>
        
    </City>
      
    </Province>
      
    <Province Name="天津市" PostalCode="120000">
        
    <City Name="市辖区" PostalCode="120100">
          
    <county Name="和平区" PostalCode="120101"/>
         ..
          
    <county Name="西青区" PostalCode="120111"/>
          
    <county Name="津南区" PostalCode="120112"/>
          
    <county Name="北辰区" PostalCode="120113"/>
          
    <county Name="武清区" PostalCode="120114"/>
          
    <county Name="宝坻区" PostalCode="120115"/>
        
    </City>
        
    <City Name="县" PostalCode="120200">
          
    <county Name="宁河县" PostalCode="120221"/>
          
    <county Name="静海县" PostalCode="120223"/>
          
    <county Name="蓟县" PostalCode="120225"/>
        
    </City>
      
    </Province>
    </China>

    2. 建立三个DropDownList (AutoPostBack为True)和三个XmlDataSource ,省份列表直接绑定即可。

    <form id="form1" runat="server">
        
    <div>
            
    <label>省  份</label>
            
    <asp:DropDownList ID="Provinces" runat="server" DataSourceID="ProvinceList" DataTextField="Name" DataValueField="PostalCode" OnSelectedIndexChanged="Provinces_SelectedIndexChanged" AutoPostBack="True">
            
    </asp:DropDownList><asp:XmlDataSource ID="ProvinceList" runat="server" DataFile="~/incxml/State.xml"
                XPath
    ="China/Province"></asp:XmlDataSource>
            
    <label>城  市</label>
            
    <asp:DropDownList ID="Cities" runat="server" AutoPostBack="True" OnSelectedIndexChanged="Cities_SelectedIndexChanged">
            
    </asp:DropDownList><asp:XmlDataSource ID="CityList" runat="server" DataFile="~/incxml/State.xml"
                XPath
    ="China/Province/City"></asp:XmlDataSource>
            
    <label>区  县</label>
            
    <asp:DropDownList ID="County" runat="server">
            
    </asp:DropDownList><asp:XmlDataSource ID="CountyList" runat="server" DataFile="~/incxml/State.xml"
                XPath
    ="China/Province/City/county"></asp:XmlDataSource>
        
    </div>
        
    </form>
    省份和城市列表的OnSelectedIndexChanged事件,指定相应列表的DataSourceID属性即可,同时把相应的XMLDataSource的XPath属性更改
    protected void Provinces_SelectedIndexChanged(object sender, EventArgs e)
        
    {
            CityList.XPath 
    = "China/Province[@PostalCode=" + Provinces.SelectedValue + "]/City";
            Cities.DataSourceID 
    = "CityList";
            Cities.DataTextField 
    = "Name";
            Cities.DataValueField 
    = "PostalCode";
        }

        
    protected void Cities_SelectedIndexChanged(object sender, EventArgs e)
        
    {
            CountyList.XPath 
    = "China/Province[@PostalCode=" + Provinces.SelectedValue + "]/City[@PostalCode=" + Cities.SelectedValue + "]/county";
            County.DataSourceID 
    = "CountyList";
            County.DataTextField 
    = "Name";
            County.DataValueField 
    = "PostalCode";
        }

  • 相关阅读:
    安卓手机无法使用adb导出文件
    dex2jar 报错 com.googlecode.d2j.DexException: not support version
    夜神模拟器adb连接
    无法安装 /lib/x86_64-linux-gnu/libpng12.so.0 的新版本: 没有那个文件或目录
    mysql基础 -创建
    VScode
    阿强的TypeScript基础
    Vue由浅入深之Array变化侦测
    深入浅出Vue.js一之Object的变化侦测
    阿强工作中常用的js的数组方法汇总
  • 原文地址:https://www.cnblogs.com/sujingnan/p/1122679.html
Copyright © 2011-2022 走看看