Dynamic control nightmare!

[Geekitygeek]

Hi Guys, I am having a hellish time getting this to work...i'm fairly new to asp.net so i may be making some glaringly obvious mistake :/

In the page init i read products from my database and populate the page with images/links/buttons/etc. The problem i have is twofold:

If i use form.Controls.Add(button) to add my buttons i CAN add event handlers but i CANNOT add to the form.InnerHTML as it is no longer "literal".

To get around this i have a method to render the control:

private string RenderControl(Control ctrl)
        {
            StringBuilder sb = new StringBuilder();
            StringWriter tw = new StringWriter(sb);
            HtmlTextWriter hw = new HtmlTextWriter(tw);

            ctrl.RenderControl(hw);
            return sb.ToString();
        }

Problem round two: if i use form.InnerHTML = RenderControl(button) i can add buttons and markup to the page without the "literal" issue. BUT, the controls dont appear in the pages control hierarchy and subsequently dont fire events :(

Is there some way to add controls to the hierarchy that will still allow me to add other HTML markup to the forms inner html?

Heres a short snippet to show you what im attempting:

int rowCount = 0;
                int prodCount = 0;
                frmProducts.InnerHtml += @"<div class=""ProductRow"" id=""Row" + rowCount + @""">";

                for (int i = 0; i < links.Rows.Count; i++)
                {
                    DataRow link = links.Rows[i];

                    frmProducts.InnerHtml += string.Format(@"<div class=""Product"" id=""p" + rowCount + prodCount + @""">
                <div class=""imageDiv"">
                    <a href=""{2}"" class=""linkImageAnchor"">
                        <img src=""{0}"" alt=""{1}"" class=""ProductImage"" />
                    </a>
                </div>
                <div class=""productText"">
                    <a href=""{2}"">{1}</a>
                    <p>
                        {3}</p>
                </div>", link["ImageURL"], link["Name"], link["URL"], "£3.99");
                    Button btn = new Button();
                    btn.CssClass = "btnSmall Info";
                    btn.Text = "Info";
                    btn.Attributes.Add("runat", "server");
                    btn.OnClientClick = "btn_OnClick()";
                    frmProducts.InnerHtml += RenderControl(btn); //renders control but doesnt add it to hierarchy :(
                    frmProducts.InnerHtml += "</div>";

                    prodCount++;
                    if (prodCount == 4)
                    {
                        prodCount = 0;
                        frmProducts.InnerHtml += @"</div>";
                        if (i < links.Rows.Count - 1)
                        {
                            rowCount++;
                            frmProducts.InnerHtml += @"<div class=""ProductRow"" id=""Row" + rowCount + @""">";
                        }
                    }
                }

                frmProducts.InnerHtml += @"</div>";

Any help would be greatly appreciated!!

[Geekitygeek]

Wow, almost 80 views and not one reply : /

I came at this with a fresh head this morning and the solution was remarkably simple:
If i add controls to the form its content is no longer literal so i cannot append literal strigns to it. So i needed to find a way to add literal strings containing the html markup in between the controls. The answer: LiteralControl...DUUH! Cant believe i overlooked this one lol. Instead of appending the strigns to the forms innerHTMl property i placed them in a LiteralControl and added them to the forms control hierarchy. The result - all my markup and controls are displayed exactly as before, but the buttons are in the hierarchy so i can add and fire event handlers properly.

Thanks for anyone who took the time to read my problem and sorry if i didnt explain myself very well. For anyone who stumbles across this looking for answers of their own i hope this helps :)

SOLVED! :D