Creating asp:Table from c# backend in asp.net webform

Question

For some reason my code isn't being displayed like a normal table it is just outputting a block of text instead.

Here is the code I have written in the backend to create my table:

    protected void LoadData(object sender, ImageClickEventArgs e)
    {
        //Populating a DataTable from database.
        DataTable dt = this.GetData();

        //Building an HTML string.
        StringBuilder html = new StringBuilder();

        //Table start.
        html.Append("<asp:Table ID=\"Table2\" runat=\"Server\" CellPadding=\"2\" CellSpacing=\"1\" BorderColor = \"CadetBlue\" BorderWidth = \"1\" BorderStyle = \"Dashed\" >");

        //Building the Data rows.
        foreach (DataRow row in dt.Rows)
        {
            html.Append("<asp:TableRow runat=\"Server\" BorderWidth=\"1\">");
            foreach (DataColumn column in dt.Columns)
            {
                html.Append("<asp:TableCell runat=\"Server\" BorderWidth=\"1\">");
                html.Append(row[column.ColumnName]);
                html.Append("</asp:TableCell>");
            }
            html.Append("</asp:TableRow>");
        }

        //Table end.
        html.Append("</asp:Table>");

        //Append the HTML string to Placeholder.
        PlaceHolder1.Controls.Add(new Literal { Text = html.ToString() });
    }

This is a sample of the output im getting:

Yamaha XTZ 650) N/Yamaha TRXBentley H-SectionBentley I-SectionBMW SPFord 5.23 NarrowFord 6.173 NarrowSuzuki GSX-R 750Non-Split I-SectionNissan GTR6Peugeot 1.9Vauxhall CorsaFerrariBMW SPFord SPTR3 SPTR6 SPSteyr PuchClimax WLKHealey 3000Vauxhall SPRS2000Peugeot/BMWPeugeot 5/16MGB 1800Peugeot 3/8F3 Ext. 5/16BLSFord CVH 1600F3 5/16F3 5/16Ford Zetec Bushed S/EFord 5.65 NarrowPeugeot SPFord Zetec SPVolvo SPVolvo SPBMW SPPeugeotFord 5.4 SPOpel 2.3 DAlfa Romeo V6LagondaVauxhall Ext.Ford 5.4 NarrowFord 5.0 NarrowFord 4.926 WideHonda CRXPeugeot 5/16 SPMini Cooper Ext.Lagonda Ext.Audi 5CylPeugeot SPF3Unknown V6Mountune SpecialTriumph SPVauxhall Corsa Ext.Ford Cosworth SierraF3Ford Narrow SPRS2000 SPCosworth

I just want it to come out in a table structure '

Answer 1

Here is a good example for you : ( https://forums.asp.net/t/1797172.aspx?How+to+create+table+dynamically+in+asp+net )

First put a asp:Literal control in you page where you want to show your table, as below

    <asp:Literal ID="litTable" runat="server" />

Now in your the event where data is fetched, write the below code to loop though data source and build a table

    StringBuilder htmlTable = new StringBuilder();
    htmlTable .AppendLine("<table">");
    htmlTableString.AppendLine("<tr>");
    htmlTableString.AppendLine("<th>colum 1</th>");
    htmlTableString.AppendLine("<th>colum 2</th>");
    htmlTableString.AppendLine("<th>colum 3</th>");
    htmlTableString.AppendLine("</tr>");

/ Put a for loop here and repeat the below code /

    htmlTableString.AppendLine("<tr>");
    htmlTableString.AppendLine("<td>colum 1 data</td>");
    htmlTableString.AppendLine("<td>colum 2 data</td>");
    htmlTableString.AppendLine("<td>colum 3 data</td>");
    htmlTableString.AppendLine("</tr>");

/ End For loop /

    htmlTableString.AppendLine("</table>");
    litTable.Text = htmlTableString.ToString();

This will create an HTML string and assign to you literal, thats all!