ASP.NET에서 붕괴 가능한 영역 생성
-
19-09-2019 - |
문제
현재 나는 컨트롤의 붕괴 상태를 제어하기 위해 레이블 (AssistateControlID)과 유사한 동작을하는 붕괴 제어를 구축했습니다.
제어를 따라 제작하고 싶습니다.
CARBAPSABLEAREA http://img692.imageshack.us/img692/3307/stackoverflowcollapseab.jpg
나는 다음과 같은 생각을 생각했다.
이미 빌드 빌드 컨트롤 및 기타 컨트롤 (예 : 패널)을 함께 모아서 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 개의 추가 개인 속성을 포함하는 유형의 "제어"입니다.
- "Collapsablecontrol"
- "패널"
나는 CollapsableArea.controls의 getter를 collapsablearea.panel.controls로 리디렉션하는 것으로 충분하다고 생각했습니다. CollapsableArea.createChildControls () I에서 i는 CollapSableControl 및 패널을 base.controls 및 collapsablearea.renderchildren ()에 Instanciate 및 추가하여 2를 렌더링합니다.
지금 내 문제 : ClacraBableControl은 ClientID를 가져옵니다 (ID를 설정하지 않고) - 패널이 < % %> - 태그가 포함되어 있으면 패널이 CARLAPSABLECONTROL을 실패하지 않으면 렌더링하지 않습니다.
제안이 있습니까?
편집하다:누락 된 ID의 동작을 수정했습니다. 단지 collapsablecontrol. 관련 구성을 Panel.clientID로 설정합니다 ... 그러나 패널에 < % %>를 넣을 때는 렌더링되지 않습니다.
해결책 2
오, 어떻게 - 나는이 문제를 해결했다.
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);
}
}
}
다른 팁
간단한 패널을 따라 가면 휠을 다시 발명 한 경우 접을 수있는 패널 컨트롤을 사용할 수 있습니다.
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/collapsiblepanel/collapsiblepanel.aspx
이후의 기능을 얻는 가장 쉬운 방법 일 수 있습니까?
컨트롤은 접을 수있는 컨텐츠를 정의하기 위해 템플릿 제어 속성을 가져와야합니다. 그리고 당신이 말했듯이, 레이블 컨트롤 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();
}