爲什麼我的ASP.Net自定義控件在我的第一個子控件上呈現兩個id屬性？

Question

我正在寫一個從CompositeControl繼承的小型ASP.Net自定義控件。該控件只是一個包含兩個子面板的面板，每個子面板中都有一個標籤。呈現時，我在HTML源代碼中看到，我的自定義控件的第一個子控件獲取兩個id屬性 - 第一個是自定義控件本身的ID，第二個是我分配給第一個子控件的ID屬性。這是爲什麼發生？

代碼：

[ToolboxData("<{0}:MessageBox runat=server></{0}:MessageBox>")] 
public class MessageBox : CompositeControl { 

    private Panel _MessageHeaderContainer = null; 
    private Label _MessageHeaderLabel = null; 
    private Panel _MessageDetailsContainer = null; 
    private Label _MessageDetailsLabel = null; 

    protected override HtmlTextWriterTag TagKey { 
     get { 
      return HtmlTextWriterTag.Div; 
     } 
    } 

    protected override void CreateChildControls() { 

     // Message header area. 
     _MessageHeaderContainer = new Panel(); 
     _MessageHeaderContainer.ID = "HeaderContainer"; 
     _MessageHeaderContainer.CssClass = "__MessageBox_Container"; 
     this.Controls.Add(_MessageHeaderContainer); 

     // Message header text. 
     _MessageHeaderLabel = new Label(); 
     _MessageHeaderLabel.ID = "HeaderLabel"; 
     _MessageHeaderLabel.Text = "[ Header ]"; 
     _MessageHeaderContainer.Controls.Add(_MessageHeaderLabel); 

     // Message details area. 
     _MessageDetailsContainer = new Panel(); 
     _MessageDetailsContainer.ID = "DetailsContainer"; 
     this.Controls.Add(_MessageDetailsContainer); 

     // Message details text. 
     _MessageDetailsLabel = new Label(); 
     _MessageDetailsLabel.ID = "DetailsLabel"; 
     _MessageDetailsLabel.Text = "[ Details ]"; 
     _MessageDetailsContainer.Controls.Add(_MessageDetailsLabel); 

    } 

    protected override void RenderContents(HtmlTextWriter output) { 
     AddAttributesToRender(output); 

     // Render the box. 
     _MessageHeaderContainer.RenderControl(output); 
     _MessageDetailsContainer.RenderControl(output); 
    } 
} 

用法在ASPX頁：

<cc:MessageBox ID="ctlMessageBox" runat="server" /> 

HTML輸出：

<div id="ctl00_ctl00_ctlMessageBox"> 
    <div id="ctl00_ctl00_ctlMessageBox" id="ctl00_ctl00_ctlMessageBox_HeaderContainer" class="__MessageBox_Container"> 
     <span id="ctl00_ctl00_ctlMessageBox_HeaderLabel">[ Header ]</span> 
    </div><div id="ctl00_ctl00_ctlMessageBox_DetailsContainer"> 
     <span id="ctl00_ctl00_ctlMessageBox_DetailsLabel">[ Details ]</span> 
    </div> 
</div> 

Answer 1

您可以通過徹底消除了RenderContents方法解決這個問題 - 不要用任何東西取代它。默認情況下，複合控件呈現其所有子控件。如果你這樣做，你的控制產生乾淨的標記：

<div id="test"> 
    <div id="test_HeaderContainer" class="__MessageBox_Container"> 
    <span id="test_HeaderLabel">[ Header ]</span> 
    </div> 
    <div id="test_DetailsContainer"> 
    <span id="test_DetailsLabel">[ Details ]</span> 
    </div> 
</div> 

正如您所指出的那樣，AddAttributesToRender方法是罪魁禍首 - 這是一個方便的方法使頂層控件的所有屬性（當前上下文是否是或者不是）。你會這麼稱呼的唯一原因是，如果你自己完全控制了渲染過程，並想要在一個語句中渲染頂層控件的所有屬性。

Answer 2

這是ID ASP.NET分配自定義控制作爲一個整體。如果將自定義控件包裝在Div或Span中（在自定義控件代碼本身中，而不是在標記中），則該ID將被分配給該自定義控件，而不是您的第一個內部「控件」。

事情是這樣的：

protected override void Render(HtmlTextWriter writer) 
{ 
    AddAttributesToRender(writer); 

    //must render tag or first inner control will get two IDs 
    writer.RenderBeginTag(HtmlTextWriterTag.Span); 

    //render child controls here... 

    writer.RenderEndTag(); 
}