22

ASP.NET, C#

As the title suggests I was wondering if anyone knew how to programatically (c# code behind file) add a div to another a container div (in the aspx page).

Thanks in advance

ErnieStings
  • 6,333
  • 19
  • 47
  • 54

5 Answers5

33

//create new instance of div and set all the values like the ID Check out the short Code example. It worked for me to create Divs in a web add

System.Web.UI.HtmlControls.HtmlGenericControl NewDiv = new 
    System.Web.UI.HtmlControls.HtmlGenericControl();
    NewDiv.ID = "divcreated";

or

protected void Page_Load(object sender, EventArgs e)
{
    System.Web.UI.HtmlControls.HtmlGenericControl createDiv =
    new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");      
    createDiv.ID = "createDiv";
    createDiv.Style.Add(HtmlTextWriterStyle.BackgroundColor, "Yellow");
    createDiv.Style.Add(HtmlTextWriterStyle.Color, "Red");
    createDiv.Style.Add(HtmlTextWriterStyle.Height, "100px");
    createDiv.Style.Add(HtmlTextWriterStyle.Width, "400px");
    createDiv.InnerHtml = " I'm a div, from code behind ";
    this.Controls.Add(createDiv);
}
Jacob O'Brien
  • 713
  • 1
  • 8
  • 20
20
Panel myChildPanel = new Panel();
myContainerPanel.Controls.Add(myChildPanel);
Matthew Vines
  • 27,253
  • 7
  • 76
  • 97
6

Aside from using a Panel like ocdecio suggested, there are several other possibilities.

  • You can use an asp:Literal control inside the div and fill that with pregenerated HTML
  • Add a runat="server" to the div itself and access it as a HtmlGenericControl, adding other controls to it from your codebehind.
  • Using <%= ... %>

It depends a little on the level of control you need. Still, under a most circumstances, a Panel that starts out invisible would be best:

<div>    
<asp:Panel Visible="false" id="MyPanel" runat="server">
</asp:Panel>
</div>

Then change the visibility from your codebehind when needed.

One cases where you might want to use one of the other methods is when you're stuck with some CSS file that assigns styles based on ID. In that case, using .NET controls is not really an option. But really, you should smack your designer over the head and tell him to use class names instead.

Thorarin
  • 47,289
  • 11
  • 75
  • 111
4

Use asp:Panel, which maps to a div.

Otávio Décio
  • 73,752
  • 17
  • 161
  • 228
1

This may be a very old question but I would like to add my solution for helping:

First, to the "div" you already have in your page (the one you want to add another "div" to) give the runat="server" property so you can access it from code behind, it would look like this:

<div id="superDIV" class="someCssClass" runat="server"></div>

Then in your Page_Load() method add the following:

protected void Page_Load(object sender, EventArgs e)
{
   //We create our new div
   System.Web.UI.HtmlControls.HtmlGenericControl newDiv = 
     new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");
   newDiv.ID = "newSuperDIV"; //<---Give and ID to the div, very important!
   newDiv.Style.Value = "background-color:white; height:61%;"; //<---Add some style as example
   newDiv.Attributes.Add("class", "amazingCssClass"); //<---Apply a css class if wanted
   superDiv.Controls.Add(newDiv); //<---Add the new div to our already existing div
}

Genearte your div directly inside the Page_Load function so it will assure that exists after any postback, avoid generating it inside code blocks like (!IsPostBack){} otherwise it will not exist in your page.

JCO9
  • 960
  • 1
  • 15
  • 24