Ajax 联动

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CountryCtrl.ascx.cs"
  Inherits="Daps.En.WebSite.Controls.CountryCtrl" %>

<script src="../js/jquery-1.4.2.min.js" type="text/javascript"></script>

<script type="text/javascript">
  $(document).ready(
  function() {
    var continentid = document.getElementById("<%=Hidden_ContinentId.ClientID %>").value;
    var countryid = document.getElementById("<%=Hidden_CountryId.ClientID %>").value;
    var cityid = document.getElementById("<%=Hidden_CityId.ClientID %>").value;
    $.ajax({ type: "POST",
      contentType: "application/json;charset=utf-8",
      url: "/Services/CountryService.asmx/GetContinentList",
      data: "{}",
      dataType: "json",
      success: function(result) {
        ClearContinent();
        ClearCountry();
        ClearCity();
        $("<option value=''></option>").appendTo("#Continent");
        var getContinentID = document.getElementById("<%=Hidden_GetContinentId.ClientID %>").value;
        if (getContinentID > 0) {
          document.getElementById("<%=Hidden_ContinentId.ClientID %>").value = getContinentID;
        }
        $.each(result.d, function() {
          if (this.Id == getContinentID) {
            $("<option value='" + this.Id + "' selected='selected'>" + this.Name + "</option>").appendTo("#Continent");
          } else {
            $("<option value='" + this.Id + "' >" + this.Name + "</option>").appendTo("#Continent");
          }
        });
        InitSelectContinent(getContinentID);
      }
    });
  }
  );

  function InitSelectContinent(obj) {
    if (obj > 0) {
      CountryAjax(obj);
    }
  }

  function ContinentOnchange() {
    ClearHiddenValue();
    var selectContinentId = $("#Continent").val();
    document.getElementById("<%=Hidden_ContinentId.ClientID %>").value = selectContinentId;
    CountryAjax(selectContinentId);
  }

  function CountryAjax(obj) {
    ClearCountry();
    ClearCity();
    $.ajax({ type: "POST",
      contentType: "application/json;charset=utf-8",
      url: "/Services/CountryService.asmx/GetCountryListById",
      data: "{'continentId':" + obj + "}",
      dataType: "json",
      success: function(result) {
        $("<option value=''></option>").appendTo("#Country");
        var getCountryID = document.getElementById("<%=Hidden_GetCountryId.ClientID %>").value;
        if (getCountryID > 0) {
          document.getElementById("<%=Hidden_CountryId.ClientID %>").value = getCountryID;
        }
        $.each(result.d, function() {
          if (this.Id == getCountryID) {
            $("<option value='" + this.Id + "' selected='selected'>" + this.Name + "</option>").appendTo("#Country");
          }
          else {
            $("<option value='" + this.Id + "'>" + this.Name + "</option>").appendTo("#Country");
          }
        });
        if (getCountryID > 0) {
          CityAjax(getCountryID);
        }
      }
    });
  }

  function CountryOnchange() {
    var selectcountryId = $("#Country").val();
    document.getElementById("<%=Hidden_CountryId.ClientID %>").value = selectcountryId;
    CityAjax(selectcountryId);
  }

  function CityAjax(obj) {
    ClearCity();
    $.ajax({ type: "POST",
      contentType: "application/json;charset=utf-8",
      url: "/Services/CountryService.asmx/GetCityListById",
      data: "{'countryId':" + obj + "}",
      dataType: "json",
      success: function(result) {
        $("<option value=''></option>").appendTo("#City");
        var getCityID = document.getElementById("<%=Hidden_GetCityId.ClientID %>").value;
        if (getCityID > 0) {
          document.getElementById("<%=Hidden_CityId.ClientID %>").value = getCityID;
        }
        $.each(result.d, function() {
          if (this.Id == getCityID) {
            $("<option value='" + this.Id + "' selected='selected'>" + this.Name + "</option>").appendTo("#City");
          } else {
            $("<option value='" + this.Id + "'>" + this.Name + "</option>").appendTo("#City");
          }
        });
      }
    });
  }
  function CityOnchange() {
    document.getElementById("<%=Hidden_CityId.ClientID %>").value = $("#City").val();
  }

  function ClearContinent() {
    $("#Continent").empty();
    document.getElementById("<%=Hidden_ContinentId.ClientID %>").value = 0;
  }

  function ClearCountry() {
    $("#Country").empty();
    document.getElementById("<%=Hidden_CountryId.ClientID %>").value = 0;
  }

  function ClearCity() {
    $("#City").empty();
    document.getElementById("<%=Hidden_CityId.ClientID %>").value = 0;
  }

  function ClearHiddenValue() {
    document.getElementById("<%=Hidden_GetCityId.ClientID %>").value = 0;
    document.getElementById("<%=Hidden_GetCountryId.ClientID %>").value = 0;
    document.getElementById("<%=Hidden_GetContinentId.ClientID %>").value = 0;
  }
</script>

<select class="zhou" id="Continent" onchange="ContinentOnchange()">
</select>
<select class="jiashi" id="Country" onchange="CountryOnchange()">
</select>
<select class="jiashi" id="City" onchange="CityOnchange()">
</select>
<asp:HiddenField ID="Hidden_ContinentId" runat="server" Value="0" />
<asp:HiddenField ID="Hidden_CountryId" runat="server" Value="0" />
<asp:HiddenField ID="Hidden_CityId" runat="server" Value="0" />
<asp:HiddenField ID="Hidden_GetContinentId" runat="server" Value="0" />
<asp:HiddenField ID="Hidden_GetCountryId" runat="server" Value="0" />
<asp:HiddenField ID="Hidden_GetCityId" runat="server" Value="0" />

 

 

 

 

using System;
using Daps.Common.Utilities;
namespace Daps.En.WebSite.Controls
{
    public partial class CountryCtrl : System.Web.UI.UserControl
    {
        public int ContinentID
        {
            get
            {
                return Convert.ToInt32(this.Hidden_ContinentId.Value);
            }
        }

        public int CountryID
        {
            get
            {
                return Convert.ToInt32(this.Hidden_CountryId.Value);
            }
        }

        public int CityID
        {
            get
            {
                return Convert.ToInt32(this.Hidden_CityId.Value);
            }
        }

        protected override void OnLoad(EventArgs e)
        {
            this.Hidden_GetContinentId.Value = SecurityHelper.RequestQueryNum("ContinentID").ToString();
            this.Hidden_GetCountryId.Value = SecurityHelper.RequestQueryNum("CountryID").ToString();
            this.Hidden_GetCityId.Value = SecurityHelper.RequestQueryNum("CityID").ToString();
        }
    }
}