zoukankan      html  css  js  c++  java
  • 异步 '省','市','区' 三级连动

    <一. 源代码>

    <select id="seProvince" name="seProvince" onchange="LoadCity(this.options[this.selectedIndex].value)"><option value="-1">选择省</option></select>&nbsp;&nbsp;
                             
    <select id="seCity" name="seCity" onchange="LoadArea(this.options[this.selectedIndex].value)" disabled="disabled"><option value="-1">选择市</option></select>&nbsp;&nbsp;
                             
    <select id="seArea" name="seArea" disabled="disabled"><option value="-1">选择区</option></select>


    <二. 类 异步调用方法>

    //获取省
    [AjaxPro.AjaxMethod]
    public IList GetProvince()
    {
        
    try
        
    {
            ProvinceFilter filter 
    = new ProvinceFilter();
            IList list 
    = idbprovince.ReadList(filter, "Id");
            
    return list;
        }

        
    catch
        
    {
            
    return null;
        }

    }


    //获取市
    [AjaxPro.AjaxMethod]
    public IList GetCity(int provinceID)
    {
        
    try
        
    {
            CityFilter filter 
    = new CityFilter();
            filter.ProvinceId.Value 
    = provinceID.ToString();

            IList list 
    = idbcity.ReadList(filter, "Id");
            
    return list;
        }

        
    catch
        
    {
            
    return null;
        }

    }


    //获取区
    [AjaxPro.AjaxMethod]
    public IList GetArea(int cityID)
    {
        
    try
        
    {
            AreaFilter filter 
    = new AreaFilter();
            filter.CityId.Value 
    = cityID.ToString();

            IList list 
    = idbarea.ReadList(filter, "Id");
            
    return list;
        }

        
    catch
        
    {
            
    return null;
        }

    }



    //获取信息
    [AjaxPro.AjaxMethod]
    public IList GetMyAddress(int ReceID)
    {
        
    try
        
    {
            IList list 
    = new ArrayList();

            ReceivedAddress rece 
    = idbrece.Read(ReceID);
            list.Add(rece.UserId);
            list.Add(rece.Phone);
            list.Add(rece.Mobile);

            
    //省Code
            list.Add(ProvinceCode);

            
    //市Code
            list.Add(city.Code);

            
    //区Code
            list.Add(area.Code);

            list.Add(rece.Address);
            list.Add(rece.Zip);

            
    return list;
        }

        
    catch
        
    {
            
    return null;
        }

    }


    <三. JS 加载>

    //加载省
    window.onload = function()
    {
        var result 
    = OrderSystemCtrl.AjaxMsg.AjaxMethods.GetProvince();
        
    if(result != null)
        
    {
            var list 
    = result.value;
            
    if(list != null)
            
    {
                var seprov 
    = document.getElementById("seProvince");
                
    for(i=0; i<list.length; i++)
                
    {
                    var province 
    = list[i];
                    var opt 
    = new Option(province.Name,province.Code);
                    seprov.options.add(opt);
                }

            }

        }

    }


    //加载市
    function LoadCity(provinceValue)
    {
        
    if(parseInt(provinceValue) == -1)return;

        var result 
    = OrderSystemCtrl.AjaxMsg.AjaxMethods.GetCity(provinceValue);
        
    if(result != null)
        
    {
            var list 
    = result.value;
            
    if(list != null)
            
    {
                var secity 
    = document.getElementById("seCity");
                ClearSeValue(secity);
                
    if(list.length > 0)
                
    {
                    secity.disabled 
    = false;
                    
    for(i=0; i<list.length; i++)
                    
    {
                        var city 
    = list[i];
                        var opt 
    = new Option(city.Name,city.Code);
                        secity.options.add(opt);
                    }

                }

                
    else
                
    {
                    secity.disabled 
    = "disabled";
                }

            }

            var seArea 
    = document.getElementById("seArea");
            ClearSeValue(seArea);
        }

    }


    //加载区
    function LoadArea(cityValue)
    {
        
    if(parseInt(cityValue) == -1)return;
        
        var result 
    = OrderSystemCtrl.AjaxMsg.AjaxMethods.GetArea(cityValue);
        
    if(result != null)
        
    {
            var list 
    = result.value;
            
    if(list != null)
            
    {
                var seArea 
    = document.getElementById("seArea");
                ClearSeValue(seArea);
                
    if(list.length > 0)
                
    {
                    seArea.disabled 
    = false;
                    
    for(i=0; i<list.length; i++)
                    
    {
                        var area 
    = list[i];
                        var opt 
    = new Option(area.Name,area.Code);
                        seArea.options.add(opt);
                    }

                }

                
    else
                
    {
                    seArea.disabled
    ="disabled";
                }

            }

        }

    }


     
    //清空下拉框数据
    function ClearSeValue(obj){
       
    for( i=obj.options.length; i>0;i--)
       

          obj.remove(i);  
       }
       
    }


    //选择一个常用收货地址
    function useThisAddress(ReceID)
    {
        var result 
    = OrderSystemCtrl.AjaxMsg.AjaxMethods.GetMyAddress(parseInt(ReceID));
        
    if(result != null)
        
    {
            var dt 
    = result.value;
            
    if(dt.length > 0)
            
    {
                var Province 
    = document.getElementById("seProvince");
                var City 
    = document.getElementById("seCity");
                var Area 
    = document.getElementById("seArea");
                
                Province.value 
    = dt[0];
                LoadCity(dt[
    0]);
                City.value 
    = dt[1];
                LoadArea(dt[
    1]);
                Area.value 
    = dt[2];
            }

        }

    }


  • 相关阅读:
    java9
    java8
    java7
    JavaScript将字符串拆分为数组
    JavaScript return false
    Java中前台往后台传多个id参数
    Easyui清除tree的选中
    jquery easyui tree的全选与反选
    android源码开发基础知识了解
    Android activity的生命周期
  • 原文地址:https://www.cnblogs.com/di305449473/p/1203759.html
Copyright © 2011-2022 走看看