作成collapsable地ASP.NET

Question

現在、私を築collapseControlる動作と同様のラベル(associatedControlID)制御の破綻の状態。

以下に制御したいと思い造り：

collapsableArea http://img692.imageshack.us/img692/3307/stackoverflowcollapseab.jpg

と思ったのようなもの:
この既に構築collapsableControlおよびその他の制御(例.パネル）にcollapsableArea.

初の試み:
また、パネルを

this.Parent.Controls.Add(collapsableControl);

このた:"正しくない生活サイクルの先ことができない"変更","nullReference",...例外

うえしました別の試み(まとめていきたいと思い、より良い選択により得ないtagKey):
まールへのやや高レベルなかったの

this.Controls.Add(collapsableControl);
this.Controls.Add(collapsablePanel);

この問題のように:かを設定したいテキストのパネル、スタイルのパネル...

有線!

いソリューションのためこのシナリオ?

編集：
また別の解
別の解決http://img109.imageshack.us/img109/3307/stackoverflowcollapseab.jpg

"CollapsableArea"型"制御"を含む2個性:

1. "CollapsableControl"
2. "パネル"

と思っていてどのように、リダイレクトにゲッターのCollapsableArea.ロー CollapsableArea.パネルです。制御できます。にCollapsableArea.CreateChildControls()i instanciateを追加しCollapsableControlおよびパネル。びCollapsableArea.RenderChildren()描画その2

私の現在の問題:のCollapsableControlを取得しますclientIDな設定IDのパネルな 描画CollapsableControl失敗します（渡しする場合にパネルを含む <%%>タグ

ご意見募集

編集： 私は固定の行動のID-セットするだけでCollapsableControl.AssociatedControlIDをパネルです。ClientID...が入れられるとき <%%>にパネルがなされ??!!

Answer 1

ああ、どのよう来-私はこの問題を解決:

public sealed class CollapsableArea : Control
{
    private const string ViewStateKeyCollapsableContentClientID = "collapsableContentClientID";

    private string CollapsableContentClientID
    {
        get
        {
            var obj = this.ViewState[ViewStateKeyCollapsableContentClientID];
            if (obj == null)
            {
                var collapsableContentClientID = Guid.NewGuid().ToString();
                this.ViewState[ViewStateKeyCollapsableContentClientID] = collapsableContentClientID;
                return collapsableContentClientID;
            }
            return (string)obj;
        }
    }

    /// <summary>
    /// Gets or sets the header text.
    /// </summary>
    /// <value>The header text.</value>
    public string HeaderText
    {
        get
        {
            this.EnsureChildControls();
            return this._collapseControl.Text;
        }
        set
        {
            this.EnsureChildControls();
            this._collapseControl.Text = value;
        }
    }

    public override ControlCollection Controls
    {
        get
        {
            // redirect controls
            return this._collapsableContent.Controls;
        }
    }

    #region child controls

    private readonly Panel _collapsableContent = new Panel();
    private readonly CollapsableControl _collapseControl = new CollapsableControl();

    #endregion

    public override Control FindControl(string id)
    {
        // need to redirect
        if (string.Equals(id, this._collapsableContent.ID))
        {
            return this._collapsableContent;
        }
        return this._collapsableContent.FindControl(id);
    }

    protected override void CreateChildControls()
    {
        base.Controls.Clear();

        var collapsableContentClientID = this.CollapsableContentClientID;
        this._collapsableContent.ID = collapsableContentClientID;
        this._collapseControl.AssociatedControlID = collapsableContentClientID;
        base.Controls.Add(this._collapseControl);
        base.Controls.Add(this._collapsableContent);
    }

    protected override void RenderChildren(HtmlTextWriter writer)
    {
        this._collapseControl.RenderControl(writer);
        // hack for code blocks
        if (!this.Controls.IsReadOnly)
        {
            this._collapsableContent.RenderControl(writer);
        }
        else
        {
            this._collapsableContent.RenderBeginTag(writer);
            base.RenderChildren(writer);
            this._collapsableContent.RenderEndTag(writer);
        }
    }
}

Answer 2

また、簡単なパネルはその開発のホイールを使用できる、折りたたみパネル制御:

http://www.asp.net/AJAX/AjaxControlToolkit/Samples/CollapsiblePanel/CollapsiblePanel.aspx

が最も簡単な方法、機能性だ。

Answer 3

コントロールは、テンプレート制御性を定義するcollapsableます。となっているということは、AssociatedControlID物件を取得するラベルの制御idです。

public class CollapsableArea : WebControl, INamingContainer
{
    public string AssociatedControlID { get; set; }
    public ITemplate ContentTemplate { get; set; }
}

ご登録jqueryで格安料金プランを選んでネットスクリプトのページです。

$("#The AssociatedControlID client control id").click(function(e) {
    $("#The CollapsableArea client control id").toggle();
}