Question

I want to add HTML structure and control like this from code behind into a panel

<div class='Main'>
    <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>
    <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>        <div class='cst'>
        First Name
    </div>
    <div class='csc'>
        <asp:Label ID="lblFirstName" CssClass="ronly" runat="server"></asp:Label>
    </div>
    <div class='end'>
    </div>
</div>

  <asp:Panel runat="server" CssClass="sxpnl" ID="pnlUserdata">
        </asp:Panel>

If i try to add like this

 HtmlGenericControl divcontrol = new HtmlGenericControl();
 divcontrol.Attributes["class"] = "sxro sx1co";
 divcontrol.TagName = "div";
 pnlUserSearch.Controls.Add(divcontrol);
 Label question = new Label();
 questionDescription.Text = "text";
 pnlUserSearch.Controls.Add(question);

It will add controls one after another, how can i make controls go nested like that as shown above.

Was it helpful?

Solution 2

Don't add that child control to the panel, add it to the control that should be the parent:

HtmlGenericControl divcontrol = new HtmlGenericControl();
divcontrol.Attributes["class"] = "sxro sx1co";
divcontrol.TagName = "div";
pnlUserSearch.Controls.Add(divcontrol);

Label question = new Label();
question.Text = "text";
divcontrol.Controls.Add(question); // add to the new div, not to the panel

OTHER TIPS

For appending HTML to your panel, add a LiteralControl control to your panel:

string yourHTMLstring = "<div class='Main'>....";
pnlUserdata.Controls.Add(new LiteralControl(yourHTMLstring));
  1. Take one local string variable TEMP.
  2. Create same html as you want to display on screen and store it in variable TEMP.
  3. You can take html creation of control in separate function based on requirement.
  4. Place that created html as innerHTML to your panel/div.

That's it...

<div id="Div1" runat="server">

Div1.InnerText = "Text";

Make the div runat="server"

<div id="d" runat="server"></div>

and add the controls inside div like below

d.Controls.Add();
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top