La creación de una zona plegable en ASP.NET

Question

Actualmente i he construido un collapseControl que se comporta similar a una etiqueta (associatedControlID) para controlar el colapso por el estado de un control.

siguiente control me gustaría construir:

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

pensé en algo así como:
poner mi ya construir collapsableControl y algún otro control (por ejemplo, el panel.) en conjunto para obtener un collapsableArea.

primer intento:
He intentado extender un panel y hice lo siguiente:

this.Parent.Controls.Add(collapsableControl);

pero esto me dio: "No paso ciclo de vida correcto", "no se puede modificar", "NullReference", ... excepciones

así que le di otra oportunidad (que creo que la mejor opción, debido al no obtener TagKey):
Extendí un marcador de posición e hizo lo siguiente:

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

esto causó otros problemas, como: quiero solamente para establecer el texto del panel, el estilo del panel, ...

cable!

¿tiene alguna solución para este escenario?

editar
me encontré con otra solución:
otra solución http://img109.imageshack.us/img109/3307/stackoverflowcollapseab.jpg

"CollapsableArea" es de tipo "Control", que contiene 2 propiedades privadas adicionales:

1. "CollapsableControl"
2. "Panel"

pensé que sería suficiente, para redirigir el captador de las CollapsableArea.Controls a CollapsableArea.Panel.Controls. en CollapsableArea.CreateChildControls () i instanciar y añadir la CollapsableControl y Panel para base.Controls y en CollapsableArea.RenderChildren () rinden los 2

mis problemas ahora: la CollapsableControl obtendrá un ClientId (sin establecer un ID) - el panel no render CollapsableControl fallará (o desmayado), si el panel contiene <%%> - etiquetas

alguna sugerencia?

editar i fijo el comportamiento de la falta de identificación - acaba de establecer CollapsableControl.AssociatedControlID a Panel.ClientID ... pero - al poner <%%> en el panel, no va a conseguir prestado ?? !!

Answer 1

oh, como viene - He resuelto este problema:

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

Si usted está después de un panel simple, en lugar de volver a inventar la rueda se puede utilizar el control de panel que puede contraerse:

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

podría ser la forma más fácil de obtener la funcionalidad que está después?

Answer 3

Su control debe tener una propiedad de control plantilla para definir el contenido plegable. Y como bien dice una propiedad AssociatedControlID que obtiene el identificador de control Label.

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

Usted tiene que registrar un jQuery para los scripts de inicio de la página.

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