カスケーディング・スタイルドロップダウンボックスを使用しCascadingDropDown
入門
ドロップダウンボックスとも呼ばれるリンケージドロップダウンボックスをカスケード接続、Webページが共通の特徴です。ドロップダウンボックスの数があることが前提であり、たとえば、あなたが地域を選択すると、街のドロップダウンボックスが唯一の都市は地方に属して表示するために、州、都市、通りを示し、それぞれ、3があり、都市を選択した後、通りのドロップダウンボックスにのみ表示します街の通りに属します。ASPは、ドロップダウンボックスを行うとき、これは、javascriptのコードを書くの多くを多くの労力を要するように覚えていません。今Asp.Netの時代に、一緒に共通のDropDownListコントロールとCascadingDropDownコントロールでのAjaxコントロールツールキットの使用、およびWeb Serive、非常に容易になるような機能を実現するために。この記事では、それを達成するためのステップバイステップします。
データベースとデータアクセス
私たちは、この資料で説明このトピックの一部とは、実際には関係ありませんが、我々は、データを「カスケード表示することができます」する必要があり、我々は、サンプル・データベースを作成する必要がありますが、また、そのデータ・アクセス・メソッドを持っている必要があります。この部分については、私は例えば、地方、都市、通りにはまだだけの簡単な手順を与えます：
- ソリューションを作成し、サイトを追加し、SiteDBにApp_Dataにでデータベースを作成します。
- 3、すなわち省（ID、名前）、市（ID、名前、ProvinceId）、ストリート（ID、名前、CityId）にSiteDBでテーブルを作成します。INT Idは、前記自己増力型、主キーであり、名前はVARCHAR（50）です。外部キーと比較ProvinceIdとCityId。
- あなたが気にしないならば、あなたはこの記事に付属するデータベース内のコードをコピーすることができ、上記の3つのテーブルのためにいくつかのサンプルデータを追加します。
- App_Code内のデータ・セットを追加SiteDataSet。次に、「サーバーエクスプローラ（サーバーブラウザ）」を開き、上記の3つのテーブルにドラッグ。
- TableAdapterのそれぞれのすべてのデータは、それぞれ、州、ストリートおよび市のために得られた構成、およびデータ収集とCityId ProvinceId、以下に示す最終SiteDataSetに従って：
OK、データベースとデータアクセスが完了するまで、その後、我々は、Webページを見て。
Webページのレイアウトと設定
まず、我々は関係なく、実現されているそのの、サイトAddressServiceという名前の「Ajax対応のWCFサービス（AJAX対応WCFサービス）」に追加します。ScriptManagerで（ここでは、本明細書に登録されていない）、それを登録します。
<ASP：のScriptManager ID = "ScriptManager1"にrunat = "サーバー">
<サービス>
<ASP：ServiceReferenceパス= "〜/ AddressService.svc" />
</サービス>
</ ASP：のScriptManager>
例えば、以下のページのレイアウトなどDefault.aspxを開きます：
DropDownListの3つの別々のIdはddlProvince、ddlCity、ddlStreetです。例えば、以下にその設定として、ページ上にAjaxControlToolkit 3 CascadingDropDownからドラッグした後：
<ajaxControlToolkit：CascadingDropDown ID = "CascadingDropDown1"
にrunat = "サーバー"
TargetControlID = "ddlProvince"
カテゴリー= "省"
PromptText = "请选择省份...."
LoadingText = "加载中、请稍后..."
ServicePath = "AddressService.svc"
ServiceMethod = "GetProvince"
>
</ ajaxControlToolkit：CascadingDropDown>
<ajaxControlToolkit：CascadingDropDown ID = "CascadingDropDown2"
にrunat = "サーバー"
TargetControlID = "ddlCity"
ParentControlID = "ddlProvince"
カテゴリー= "市"
PromptTextは=「都市を選択してください....」
LoadingText =「ロードは、しばらくお待ちください...」
ServicePath = "AddressService.svc"
ServiceMethod = "GetCity"
>
</ ajaxControlToolkit：CascadingDropDown>
<ajaxControlToolkit：CascadingDropDown ID = "CascadingDropDown3"
にrunat = "サーバー"
TargetControlID = "ddlStreet"
ParentControlID = "ddlCity"
カテゴリー= "ストリート"
PromptText = "请选择城市...."
LoadingText = "加载中、请稍后..."
ServicePath = "AddressService.svc"
ServiceMethod = "GetStreet"
>
</ ajaxControlToolkit：CascadingDropDown>
これら三つCascadingDropDown DropDownListコントロールは、一般的に前に追加対応する以下はその特性の各々の簡単な説明です。
- TargetControlID：IDは、DropDownListコントロールとのコラボレーション。
- ParentControlIDは：親のドロップダウンボックスのIDは、トップダウンボックスddlProvinceは明らかに親のドロップダウンボックスが含まれていないので、ParentControlIDが含まれていません。
- カテゴリー：このドロップダウンボックス「カテゴリは」また再び戻って特定の使用の名前として知られているが、私にはよく理解されていない、ここで述べました。
- テキストは選択の前に表示される：PromptText。
- LoadingText：あなたがあるため、サーバーと通信する必要のロード時に表示されるテキストは、それは必然的に遅らせるためにつながる、ここではテキスト表示時に遅延のテキストです。
- ServicePath：Webサービス取得したデータ。ここに私たちのWCFサービスです。
- ServiceMethod：データを取得する方法。これらのメソッドは明らかに我々はそれを理解していない、WCFサービスによって実現されています。
まあ、今のページの一部を設定するために、我々は最終的に見てWCFサービスを実現する、それがデータを取得するために使用するデータセットを作成するための唯一の最初のステップです。
WCFサービスのコードを書きます
WCFサービスの方法は、実際にCascadingDropDown上記の3つにおいて達成されるデータを取得するために設けられた：GetProvince（）、GetCity（）getStreet及び（）を。なぜなら、あなたが私に似ているので、もし、その後のWeb.Configでそれを登録する必要があり、AjaxControlToolkitアセンブリを展開するGACを使用して、コードビハインドページで定義されたタイプを使用する必要のAjaxControlToolkit：
<コンパイル、デバッグ= "真の">
<アセンブリ>
<アセンブリを追加= "AjaxControlToolkit、バージョン= 3.0.20820.37372、カルチャニュートラル、PublicKeyToken = = 28f01b0e84b6d53e" />
<！ -省略其他- >
</アセンブリ>
</編集>
：次は方法は、明らかに、それはすべての州を取得します）（GetProvince見AddressService中にApp_Codeを達成するために、これらの3つのメソッドを達成します
パブリッククラスAddressService
{
[OperationContract]
パブリックCascadingDropDownNameValue [] GetProvince（文字列knownCategoryValues、文字列カテゴリ）
{
のThread.sleep（1000）; //等待1秒、模拟网络延迟
SiteDataSetTableAdapters.ProvinceTableAdapter provinceAdapter
=新しいSiteDataSetTableAdapters.ProvinceTableAdapter（）。
SiteDataSet.ProvinceDataTable provinceTable = provinceAdapter.GetProvince（）。
一覧<CascadingDropDownNameValue>値=新しいリスト<CascadingDropDownNameValue>（）;
foreachの（provinceTableでSiteDataSet.ProvinceRow州）{
文字列ID = province.Id.ToString（）。
文字列名= province.Name。
values.Add（新しいCascadingDropDownNameValue（名前、ID））;
}
）（values.ToArrayを返します。
}
}
私たちは署名法、我々が定義されたカテゴリにCascadingDropDown属性値であり、2番目のパラメータのカテゴリを見て、私たちはいくつかの処理を行うことがここに広がりました。トップ州のために、この場合のknownCategoryValues空の文字列にして、ドロップダウンボックス以来、「カテゴリーID」親カテゴリ値とIDの値のドロップダウンボックスを含むフォーム：最初のパラメータ。戻り値は配列であるCascadingDropDownNameValue、実際には、クライアントに戻すの結合のためのキー/値のペア。
私は、メソッドのコンテキストで任意の説明を必要としないと思う、最も一般的ですが、厳密に型指定されたDataSetの基本動作。コントロールはLoadingTextの効果を示すことができるように、ネットワーク遅延の影響をシミュレートするために、ここで、そののThread.sleep（1000）を注意してください。
次に、我々は残りのGetCityとGetStreetメソッドを実装するには2つの方法を見て：
[OperationContract]
パブリックCascadingDropDownNameValue [] GetCity（文字列knownCategoryValues、文字列カテゴリ）
{
のThread.sleep（1000）;
StringDictionary keyValueの=
CascadingDropDown.ParseKnownCategoryValuesString（knownCategoryValues）。
INT provinceId = Convert.ToInt32（keyValueの[ "州"]）。
SiteDataSetTableAdapters.CityTableAdapter cityAdapter =
新しいSiteDataSetTableAdapters.CityTableAdapter（）;
SiteDataSet.CityDataTable cityTable = cityAdapter.GetCityByProvinceId（provinceId）。
一覧<CascadingDropDownNameValue>値=新しいリスト<CascadingDropDownNameValue>（）;
foreachの（SiteDataSet.CityRow cityTable都市）{
文字列ID = city.Id.ToString（）。
文字列名= city.Name。
values.Add（新しいCascadingDropDownNameValue（名前、ID））;
}
）（values.ToArrayを返します。
}
[OperationContract]
パブリックCascadingDropDownNameValue [] GetStreet（文字列knownCategoryValues、文字列カテゴリ）{
のThread.sleep（1000）;
StringDictionary keyValueの=
CascadingDropDown.ParseKnownCategoryValuesString（knownCategoryValues）。
int型cityId = Convert.ToInt32（keyValueの[ "市"]）;
SiteDataSetTableAdapters.StreetTableAdapter streetAdapter =
新しいSiteDataSetTableAdapters.StreetTableAdapter（）;
SiteDataSet.StreetDataTable streetTable = streetAdapter.GetStreetByCityId（cityId）。
一覧<CascadingDropDownNameValue>値=新しいリスト<CascadingDropDownNameValue>（）;
foreachの（streetTableでSiteDataSet.StreetRow通り）{
文字列ID = street.Id.ToString（）。
文字列名= street.Name。
values.Add（新しいCascadingDropDownNameValue（名前、ID））;
}
）（values.ToArrayを返します。
}
これらの2つの方法は、これまで我々GetCity（）メソッドの説明として、完全に類似しています。私たちは今、「陝西省」、など地方でページを選択し、そのidが「2」であれば、knownCategoryValuesが値「県：2」が含まれ、上記の指示に従ってくださいカテゴリが含まれており、親コントロールの値を選択しますid値は、それを通して我々は選択した地方のIDを取得することができます。我々は、スプリット（）メソッドを使用するなど、手動でこの文字列を処理する必要はないが、上記のコードに示すように、CascadingDropDown.ParseKnownCategoryValuesString静的メソッドを使用して達成することができます。
地方のIDを取得した後、我々は、IDに応じて含まれている州は、コードはすでに理解している必要があり、その下の都市を取得するには、データアダプターのメソッドを呼び出すことができます。
まあ、今ではすべての準備ができ、私たちは、実際の結果を見るためにページをめくることができます。
概要
在这篇文章中，我们又实现了Web中的一个常见功能：级联式下拉框。我们先创建了范例数据库，以及一个强类型DataSet用作数据访问。随后对Web页面进行了布局，设置了控件属性。最后编写了WCF服务，获取客户端所需要的数据。
感谢阅读，希望这篇文章能给你带来帮助！
转载于:https://www.cnblogs.com/JimmyZhang/archive/2008/11/05/1327710.html