c# - How to generate dynamic labels and use the column name and value as the text

Question

Is there any way, if it is possible to dynamically generate the ASP.net page from code-behind.

Example:

ASP.net:

<div class="hidOverflow setFloatL smallPadLeft" style="width: 45%" runat="server" id="dvLeft">
</div>
<div class="hidOverflow setFloatL smallPadLeft" style="width: 45%" runat="server" id="dvRight">
</div>

Code-behind:

using (SqlConnection conn = new SqlConnection(gloString))
{
    try
    {
        strQuery = @"";

        SqlDataAdapter da = new SqlDataAdapter(strQuery, conn);

        DataSet myDataSet = new DataSet();
        da.Fill(myDataSet);

        //dynamically generate label with the SQL column name as the Text
        //dynamically generate label with the SQL column value as the text
        //<div class="hidOverflow smallPad">
            //<div class="setFloatL halfWidth vertAlignT">
                //<span class="profileLabel">{SQL COLUMN NAME}</span>
            //</div>
            //<div class="setFloatL vertAlignT">
                //<asp:Label ID="lbl1" ClientIDMode="Static" runat="server" Text="{SQL COLUMN VALUE}"></asp:Label>
            //</div>
        //</div>
        //.. more .. stop at the 1/2 mark of the count for the dataset and add it to the "dvLeft" div

        // STOP...

        //dynamically generate label with the SQL column name as the Text
        //dynamically generate label with the SQL column value as the text
        //<div class="hidOverflow smallPad">
            //<div class="setFloatL halfWidth vertAlignT">
                //<span class="profileLabel">{SQL COLUMN NAME}</span>
            //</div>
            //<div class="setFloatL vertAlignT">
                //<asp:Label ID="lbl1" ClientIDMode="Static" runat="server" Text="{SQL COLUMN VALUE}"></asp:Label>
            //</div>
        //</div>
        //.. more .. continue from the 1/2 mark of the count for the dataset and add it to the "dvRight" div
    }
    catch (SqlException)
    {
    }
}

I am looking to make it dynamic so all I have to do is change the SQL query and the labels will be generated accordingly.

I can most likely use a asp:Repeater control to achieve it?

Answer 1

You could try binding the repeater to the Datatable ColumnCollection:

private DataTable _dataTable;

public void LoadRepeater()
{
    //load dataset
    _dataTable = myDataSet.Tables[0];
    repeater.DataSource = _dataTable.Columns;
    repeater.DataBind();
}

public string GetColumnValue(string columnName)
{
    return _dataTable.Rows[0][columnName].ToString();
}

Then on the repeater:

<ItemTemplate>
   <div class="hidOverflow smallPad">
        <div class="setFloatL halfWidth vertAlignT">
            <span class="profileLabel"><%# Eval("ColumnName") %></span>
        </div>
        <div class="setFloatL vertAlignT">
            <asp:Label ID="lbl2" ClientIDMode="Static" runat="server" Text='<%# GetColumnValue(Eval("ColumnName")) %>'></asp:Label>
        </div>
  </div>
</ItemTemplate>

This will only work if you have a single row on your DataTable though.

If you have more Rows, you may have to include an additional repeater for the row dimension.

------------------------------------------------------------------

To Split the columns, you could do something like this (untested):

private void LoadRepeater()
{
    //load dataset
    _dataTable = myDataSet.Tables[0];
    int columnCount = _dataTable.Columns.Count;
    int half = (int)columnCount/2;

    var columnCollection = _dataTable.Columns.OfType<DataColumn>();
    var firstHalfColumns = columnCollection.Take(half);
    var secondHalfColumns = columnCollection.Skip(half);

    repeater1.DataSource = firstHalfColumns;
    repeater1.DataBind();

    repeater2.DataSource = secondHalfColumns;
    repeater2.DataBind();
}