この章では、CollapsiblePanelExtenderを使用する方法について説明します。CollapsiblePanelExtenderとやや似アコーディオンの最後の章が、また、指定した領域のズームを制御することができます。しかし、管理領域は、アコーディオン基、領域のそれぞれとの間の相互作用を生成することができる基、他を開くこと、および主にズームCollapsiblePanelExtender単一の領域を制御するために閉じられます。
ステップ1:AJAXコントロールツールキットウェブサイトを作成します。
この例では、主にここに一覧表示するには、2つのパネルのコントロールとCollapsiblePanelExtenderコンポーネントに加え、いくつかの補助コントロールをする必要はありません。次のように:
これらは、パネル1のコードであり、状態Panel2を制御する責任があるパネル1の制御領域です。パネル1では、私たちは、ImageコントロールとLabelコントロールを定義する場所。両方のコントロールは、Panel2の状態に応じて異なる画像やテキストを表示することができます。
注意:これは、サーバーコントロールを使用する必要があり、そうでない場合CollapsiblePanelExtenderは、関連するコントロールを見つけることができません。
Panel2コンテンツがあれば上の記事のように、それはもはやここにリストされていません。
関連するCSSスタイルを取り付けます。
注意:上記のCSSスタイル、 collapsePanelがある Panel2のこのスタイルで使用されるスタイル、我々は高さを指定することはできません、そうでない場合は Panel2は通常、私たちすることができますセルフテストを表示し、非表示にすることができません。
ステップ2:設定CollapsiblePanelExtender
あまりにも多くのプロパティを設定するため、次のコードを参照してください。
CollapseControlIDは、隠された制御は、制御IDを、意味あるExpandControlIDがその値であるように、これは、制御領域の一例に過ぎないので、制御を制御IDの表示を意味するパネル1を。あなたは二つの制御エリアを持っている場合は、それらの値を指定することができます。TagetControlIDは、ターゲット制御IDを制御する必要性を意味し、ここでPanel2が。ImageControlIDはここで、コントロールIDの状態の表示画面を指している画像1あなたが指定することはできませんされていない場合、。TextLabelIDはここで、表示制御IDのステータステキストを指しているのLabel1これを指定することはできませんされていない場合、。次CollapsedText、ExpandedText、CollapsedImageとExpandedImageは異なる状態で表示されるテキストや画像を指定することで、彼らは実際の状況に応じて設定します。
セットアップし、実行します!示すように、結果:
「隠された内容」に隠された上で次の記事をクリックしてください。
終了:
この章では、使用するCollapsiblePanelExtenderを紹介します。やや似ていますが、アコーディオン、CollapsiblePanelExtender効果少し単調な、しかしアコーディオンは、異なる状態の表示画像とテキストを設定するよりも、我々は時間を選択右のコンポーネントを選択するために、現実から進まなければなら単純に使用して比較CollapsiblePanelExtenderとアコーディオン。
トラックバック:http://www.cnblogs.com/sbitxg521/archive/2007/12/29/1020308.html
ます。https://www.cnblogs.com/hdjjun/archive/2008/06/17/1223664.htmlで再現