Création d'une zone dans ASP.NET collapsable

Question

actuellement j'ai construit un collapseControl qui se comporte comme une étiquette (associatedControlID) pour contrôler l'effondrement d'état d'un contrôle.

suite d'un contrôle je voudrais construire:

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

Je pensais à quelque chose comme:
mettre mes construire déjà collapsableControl et un autre contrôle (panneau par exemple.) ensemble pour obtenir un collapsableArea.

premier essai

:
J'ai essayé d'étendre un groupe spécial et fait ce qui suit:

this.Parent.Controls.Add(collapsableControl);

mais cela m'a donné: "pas l'étape du cycle de vie correct", "ne peut pas modifier", "nullReference", ... exceptions

donc je lui a donné un autre essai (que je crois que le meilleur choix, en raison de ne pas recevoir TagKey):
i étendu un espace réservé et fait ce qui suit:

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

cela a causé d'autres problèmes, comme: je veux seulement définir le texte du panneau, le style du panneau, ...

filaire!

vous avez des solutions pour ce scénario?

modifier: je suis venu avec une autre solution:
une autre solution http://img109.imageshack.us/img109/3307/stackoverflowcollapseab.jpg

"CollapsableArea" est de type "contrôle", contenant 2 propriétés privées supplémentaires:

1. "CollapsableControl"
2. "Groupe spécial"

Je pensais que ce serait suffisant, pour rediriger le getter des CollapsableArea.Controls à CollapsableArea.Panel.Controls. dans CollapsableArea.CreateChildControls () i instancier et ajouter le CollapsableControl et le panneau à base.Controls et CollapsableArea.RenderChildren () rendent les 2

mes problèmes maintenant: le CollapsableControl obtiendra un clientID (sans définir un ID) - le Groupe spécial ne rendre CollapsableControl échouera (ou évanoui), si le panneau contient <%%> - balises

suggestions?

modifier je fixe le comportement de l'ID manquant - il suffit de mettre CollapsableControl.AssociatedControlID à Panel.ClientID ... mais - en mettant <%%> dans le panneau, il ne sera pas rendu ?? !!

Answer 1

oh, comment se fait - je l'ai résolu ce problème:

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 vous êtes après un panneau simple, plutôt que de réinventer la roue, vous pouvez utiliser le panneau de contrôle Pliable:

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

peut-être la meilleure façon d'obtenir la fonctionnalité que vous êtes après?

Answer 3

Votre contrôle doit obtenir une propriété de contrôle modèle pour définir le contenu collapsable. Et comme vous avez dit une propriété AssociatedControlID qui obtient l'ID de contrôle d'étiquettes.

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

Vous devez vous enregistrer un jquery aux scripts de démarrage de la page.

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