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?

Precept

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();
}

Cupid

Thanks. It will always be one or no rows. Ill test it out and give update. What you think of my solution? – Precept

That is awesome. Just need to split the dataset in halves by columns and use in two separate div. Thanks for leading the way :) – Precept

Can you please let me know how to split the DataTable into two separate DT by column count... – Precept

@Precept I updated the answer with a suggestion, not sure if it's what you need. – Cupid

Scheiders you saved me from writing many queries. Thank you :) – Precept