How to create and insert HTML at run time?

Question

Would someone give a code example how to create and insert HTML at run time?

The HTML is like this:

 <div class="row">
       <div class="col-md-3">
            <img src="example.png" class="profileImage" /> <br />
            <span class="name">Name</span>
            <div class="ver"></div>
            <img class="flag ver" src="star.png" />
            <div class="horizontalBar"></div>
        </div>
    </div>

The close I get was:

 public partial class MyPage : System.Web.UI.Page
    {
     protected void Page_Load(object sender, EventArgs e)
            {
                this.Header.DataBind();
                ContentPlaceHolder contents = Page.Master.FindControl("MainContent") as ContentPlaceHolder;
                Panel row = new Panel() { CssClass = "row" };
                Panel col = new Panel() { CssClass = "col-md-3" };
                Image profile = new Image()
                {
                    CssClass = "profileImage",
                    ImageUrl = "example.jpg"
                };

                row.Controls.Add(col);
                col.Controls.Add(profile);
                contents.Controls.Add(row);
            }
}

It doesn't work (see below error) and isn't full code, for example, what class is equivalent to generate ?

I get this error:

The Controls collection cannot be modified because the control contains code blocks

What's the reason of that error? which are those code blocks and how do I fix this?

Anderson Pimentel · Accepted Answer · 2016-03-01 16:43:36Z

1

I've tested the code here and it's working.

The control equivalent to span is Label, but I think there must be better ways of doing this.

If you really need to dynamically insert HTML code, you can inject it using the LiteralControl, like this:

var html = new LiteralControl(@"<div class=""row"">
                                  <div class=""col-md-3"">
                                    <img src=""example.png"" class=""profileImage"" />
                                    <br />
                                    <span class=""name"">Name</span>
                                    <div class=""ver""></div>
                                    <img class=""flag ver"" src=""star.png"" />
                                    <div class=""horizontalBar""></div>
                                  </div>
                               </div>");
contents.Controls.Add(html);

edited Mar 1, 2016 at 16:43

answered Mar 1, 2016 at 16:37

Anderson Pimentel

5,8532 gold badges38 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Jack Over a year ago

How is your asp:content defined? like this <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

Jack Over a year ago

I found the source of the error, I've already a HTML tag inside <asp:Content>. THis cause the error. I just added another div inside <asp:Content> and use Controls property from this div

Jack Over a year ago

And what's the equivalent of ?

Anderson Pimentel Over a year ago

I don't think there's a direct equivalent control for  , but you could use LiteralControl(" "). You can use HtmlGenericControl for other tags, but not  , since this class does not support self-closing tags: stackoverflow.com/questions/13493586/…

Collectives™ on Stack Overflow

How to create and insert HTML at run time?

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related