Best way to process a table with dynamic columns

Question

I usually use Repeater to create tables on my asp.net pages, but now I need to handle the dynamic columns in my table, so I wonder if there is a general approach to solving this issue using web controls.

I have never used a GridView , so I don’t know if it is better to display tables with dynamic columns? Can you tell me this is a more suitable approach? Is there a way to achieve this using Repeater ?

Answer 1

You can set GridView with AutoGenerateColumns to true. It will check and add columns to the DataSource

 <asp:sqldatasource id="CustomersSource" selectcommand="SELECT CustomerID, CompanyName, FirstName, LastName FROM SalesLT.Customer" connectionstring="<%$ ConnectionStrings:AWLTConnectionString %>" runat="server"/> <asp:gridview id="CustomersGridView" datasourceid="CustomersSource" autogeneratecolumns="True" emptydatatext="No data available." allowpaging="True" runat="server" DataKeyNames="CustomerID"> </asp:gridview> 

Answer 2

It is very important to know how you want to deal with the situation.

Situation 1: You have an existing table, and from time to time you add columns (which is not very practical), you can immediately go to the GridView and set the AutoGenerateColumns binding property to true.

Situation 2

You can create your own HTmlHelper class for processing tables. To do this, you can visit the following message:

How to create an MVC HtmlHelper table from a list of objects

if you use MVC.

Answer 3

Here's a quick hack if you should use Repeater :

In .aspx:

     <asp: Repeater ID = 'rptr' runat = 'server'>
         <HeaderTemplate>
             <table>
                 <thead>
                   <tr>
                     <th>
                         Always visible header col
                     </th>
                     <th id = 'thHidable' runat = 'server' class = 'hideable'>
                         Hideable header col
                     </th>
                   </tr>
                 </thead>
                 <tbody>
         </HeaderTemplate>
         <ItemTemplate>
             <tr>
                 <td>
                     Repeated col
                 </td>
                 <td id = 'tdHideable' runat = 'server' class = 'hideable'>
                     Hideable repeated col
                 </td>
             </tr>
         </ItemTemplate>
         <FooterTemplate>
             </tbody> </table>
         </FooterTemplate>
     </ asp: Repeater>

In the code behind (when using C #):

  protected override void Page_Init() { this.rptr.ItemDataBound += new RepeaterItemEventHandler(rptr_ItemDataBound); } void rptr_ItemDataBound(object sender, RepeaterItemEventArgs e) { RepeaterItem item = (RepeaterItem)e.Item; if (item.ItemType == ListItemType.Header) { HtmlTableCell thHidable = (HtmlTableCell)item.FindControl("thHidable"); if (hideCondition) { // thHidable.Visible = false; // do not render, not usable by client script (use this approach to prevent data from being sent to client) thHidable.Style["display"] = "none"; // rendered hidden, can be dynamically shown/hidden by client script } } else if (item.ItemType == ListItemType.Item || item.ItemType == ListItemType.AlternatingItem) { HtmlTableCell tdHideable = (HtmlTableCell)item.FindControl("tdHideable"); if (hideCondition) { // tdHideable.Visible = false; // do not render, not usable by client script (use this approach to prevent data from being sent to client) tdHideable.Style["display"] = "none"; // rendered hidden, can be dynamically shown/hidden by client script } } } 

(optional) If you want to dynamically display a client-side column (assuming it has been rendered) using jQuery (for short):

$(".hideable").show();