首先创建一个 Web 服务来检索下拉列表的数据
创建 web 服务: CascadingDropdown.asmx
在 CascadingDropdown.asmx.cs 中编写代码从数据库中检索国家、州和城市的数据,看看我是这样做的,你可以这样做,我使用实体框架来获取数据从数据库。
[WebMethod]
public CascadingDropDownNameValue[] FetchCountries()
{
GetLookupResponse countryLookupResponse = commonService.GetLookup("Country");
List<CascadingDropDownNameValue> countries = new List<CascadingDropDownNameValue>();
foreach (var dbCountry in countryLookupResponse.LookupItems)
{
string countryID = dbCountry.ID.ToString();
string countryName = dbCountry.Description.ToString();
countries.Add(new CascadingDropDownNameValue(countryName, countryID));
}
return countries.ToArray();
}
[WebMethod]
public CascadingDropDownNameValue[] FetchStates(string knownCategoryValues)
{
int countryID;
StringDictionary strCountries = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
countryID = Convert.ToInt32(strCountries["Country"]);
GetLookupResponse stateLookupResponse = commonService.GetLookup("State");
List<CascadingDropDownNameValue> states = new List<CascadingDropDownNameValue>();
foreach (var dbState in stateLookupResponse.LookupItems.Where(id => id.DependencyID == countryID))
{
string stateID = dbState.ID.ToString();
string stateName = dbState.Description.ToString();
states.Add(new CascadingDropDownNameValue(stateName, stateID));
}
return states.ToArray();
}
[WebMethod]
public CascadingDropDownNameValue[] FetchCities(string knownCategoryValues)
{
int stateID;
StringDictionary strStates = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
stateID = Convert.ToInt32(strStates["State"]);
GetLookupResponse cityLookupResponse = commonService.GetLookup("City");
List<CascadingDropDownNameValue> cities = new List<CascadingDropDownNameValue>();
foreach (var dbCity in cityLookupResponse.LookupItems.Where(id => id.DependencyID == stateID))
{
string cityID = dbCity.ID.ToString();
string cityName = dbCity.Description.ToString();
cities.Add(new CascadingDropDownNameValue(cityName, cityID));
}
return cities.ToArray();
}
然后在您的 aspx 文件中,您需要在下面的页面顶部注册 AjaxControlToolkit
,如果您还没有安装 AjaxControlToolkit,请从 Nuget 包中安装它。
然后你的下拉列表代码:
<label class="col-sm-3 col-form-label required">Country</label>
<div class="col-sm-9">
<asp:DropDownList ID="ddlCountry" runat="server" CssClass="form-control"></asp:DropDownList>
<ajax:CascadingDropDown ID="csdCountry" runat="server"
Category="Country"
TargetControlID="ddlCountry"
LoadingText="Loading Countries..."
ServiceMethod="FetchCountries"
ServicePath="~/CascadingDropdown.asmx"></ajax:CascadingDropDown>
</div>
<label class="col-sm-3 col-form-label required">State</label>
<div class="col-sm-9">
<asp:DropDownList ID="ddlState" runat="server" CssClass="form-control"></asp:DropDownList>
<ajax:CascadingDropDown ID="csdState" runat="server"
ParentControlID="ddlCountry"
Category="State"
TargetControlID="ddlState"
LoadingText="Loading States..."
ServiceMethod="FetchStates"
ServicePath="~/CascadingDropdown.asmx"></ajax:CascadingDropDown>
</div>
<label class="col-sm-3 col-form-label required">City</label>
<div class="col-sm-9">
<asp:DropDownList ID="ddlCity" runat="server" CssClass="form-control"></asp:DropDownList>
<ajax:CascadingDropDown ID="csdCity" runat="server"
ParentControlID="ddlState"
Category="City"
TargetControlID="ddlCity"
LoadingText="Loading Cities..."
ServiceMethod="FetchCities"
ServicePath="~/CascadingDropdown.asmx"></ajax:CascadingDropDown>
</div>
我在这里做的是当我们选择国家/地区下拉列表时,我将国家/地区 id 传递给 FetchStates 网络方法,该方法位于我们的 CascadingDropdown.asmx.cs Web 服务中,以根据国家/地区 id 获取状态,城市也是如此,通过状态 id 到 FetchCities 网络方法以获取城市。
希望能帮助到你。