Convert a Table to HTML in ASP.NET (c#)?

Question

I have a Table object that I have created and populated in my code behind. It had to be done this way for various reasons.

I call a WebMethod via AJAX from the client side to send a variable from a dropdown list and then the table gets populated in a static method in the code behind. I need to get the Table into an ASP.Net PlaceHolder. I cannot call a PlaceHolder from a static method.

Please expand your question with more information. Currently it is unclear what exact problem you are having - either you can't put table control into placeholder or you can't convert data from Table to WebMethod output. — Kaspars Ozols, Dec 11 '13 at 16:16
I've tried adding the table to the placeholder but as I said I cannot access the plachholder from the static methods. I am currently trying to turn the Table object into a format that I can pass back to the client side via the WebMethod/Ajax — arcaderob, Dec 11 '13 at 16:18
I need to insert the Table into the PlaceHolder but the table is created in a static method... — arcaderob, Dec 11 '13 at 16:19

Karl Anderson · Accepted Answer · 2013-12-11T17:43:30.170

Instead of using an ASP.NET AJAX Page Method to return the data from your client-side AJAX call, try using an ASP.NET HTTP Handler, because it will allow you to better control the content coming back via HTTP headers instead of having to encode the result of the ASP.NET AJAX Page Method call, like this:

public class GetHtmlHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        // Grab the drop down list variable value from the query string

        // Use controls to build table or do it via StringWriter

        // Create a table row with three cells in it
        TableRow theTableRow = new TableRow();
        for (int theCellNumber = 0; theCellNumber < 3; theCellNumber++)
        {
            TableCell theTableCell = new TableCell();
            tempCell.Text = String.Format("({0})", theCellNumber);
            theTableRow.Cells.Add(theTableCell);
        }

        // Create writers to render contents of controls into
        StringWriter theStringWriter = new StringWriter();
        HtmlTextWriter theHtmlTextWriter = new HtmlTextWriter(theStringWriter);

        // Render the table row control into the writer
        theTableRow.RenderControl(theHtmlTextWriter);

        // Return the string via the StringWriter
        context.Response.Write(theStringWriter.ToString());
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

Now on the client-side, use the jQuery .ajax() function to call the HTTP Handler, like this:

$(document).ready(function() {
    $.ajax({
        type: "POST",
        url: "PATH_TO_HANDLERS/GetHtmlHandler.ashx?id=YOUR_DROP_DOWN_VALUE",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(result) {
            // Select the placeholder control by class here and put HTML into it
            $('.ThePlaceHolder').html(result);
        }
    });
});

Note: The above selector requires that you add a CssClass attribute to your PlaceHolder control, like this:

<asp:PlaceHolder id="PlaceHolder1" runat="server" CssClass="ThePlaceHolder" />

UPDATE:

Instead of using the class name in your jQuery selector, you can use the ID of the PlaceHolder, I had originally advised against this, because it is subject to name mangling when using master pages in ASP.NET. At any rate, there is the ClientIDMode attribute which you can use, like this:

<asp:PlaceHolder id="PlaceHolder1" runat="server" ClientIDMode="Static" />

Now your jQuery selector would look like this:

// Select the placeholder control by ID here and put HTML into it
$('#<%= PlaceHolder1.ClientID %>').html(result);

Note: I prefer to avoid the angle bracket (<%= %>) notation where possible.

My Table object is built using TableRow and TableCell controls. How would I convert this to a string? — arcaderob, Dec 11 '13 at 16:33
@arcadeRob - answer updated to show example a table row with three cells being rendered to a string via `StringWriter` and `HtmlTextWriter` objects. — Karl Anderson, Dec 11 '13 at 16:42
It's working but I am losing the CSS and other Attributes that I added in the C# — arcaderob, Dec 11 '13 at 17:27
@arcadeRob - you can switch your jQuery selector to use the ID of the `PlaceHolder`, but you need to be careful of name mangling if you are using master pages. The `ClientID` resolves this issue. See updated answer. — Karl Anderson, Dec 11 '13 at 17:43

Convert a Table to HTML in ASP.NET (c#)?

1 Answers1