ASP.net best way to create this table?

Question

I am trying to set up a website to display this when receiving data from a web service.

What is the best way of going about displaying this table? I had a gridview to begin with but then I wanted lots of information in the 3rd column and two buttons instead of 1 in the fourth.

The data for brand and price and product name come in from my call to the webservice so I need to repeat the rows for each item I receive from that web service call.

Edit - My answer below on how I did it, I ended up just creating html in the code behind instead to display it how I wanted.

score 1 · Answer 1 · answered Mar 26 '13 at 11:36

1

I think the simplest way to do this is using a datasource, or is this not a option for you?

Repeater1.DataSource = values;
Repeater1.DataBind();

answered Mar 26 '13 at 11:36

Sir l33tname

4,026
6
38
49

I can do that for two of the columns, but how could I do that with the 3rd column that has multiple values? I don't know how I would put that into a datatable. – saintsfanuk Mar 26 '13 at 11:50
How about a repeater in a repeater as it explains here: http://stackoverflow.com/questions/2923137/repeater-in-repeater and how you save it in the database is the same because you can collect them in code behind – Sir l33tname Mar 26 '13 at 11:58

saintsfanuk · Accepted Answer · 2013-04-18T09:54:38.010

Turns out the best way to have a display like I showed in the image is to just create a html table from codebehind and populate the required sections with the data required.

I set a table

<asp:Table Width="100%" ID="tblQuotes" runat="server">  
<asp:TableHeaderRow ID="Headers" runat="server">  
    <asp:TableHeaderCell>Brand</asp:TableHeaderCell>  
    <asp:TableHeaderCell>Price</asp:TableHeaderCell>  
    <asp:TableHeaderCell>Information</asp:TableHeaderCell>  
    <asp:TableHeaderCell>Purchase</asp:TableHeaderCell>  
 </asp:TableHeaderRow>  
 </asp:Table>

Then from code behind added in the cells and the rows.

eg

row.Cells.Add(colBrand);                      
Image logo = new Image();
logo.ImageUrl = imageUrl;
colProvider.Controls.Add(logo);

score 0 · Answer 3 · answered Mar 26 '13 at 11:37

0

You will not have to do that if you are returning anything which confirms with IEnumerable interface from the api.

e.g. you can have api result in datatable or list. Both of them confirms with IEnumerable interface. You can then simply bind these objects to your repeater or grid.

Another option is to use asp.net literal control. It will give you a placeholder. As for now, I can see that you do not need to persist the state of this page so literal can also do good here. To use the literal control though, you might have to generate the html dynamically. However, it will give you perfect control over generated html.

answered Mar 26 '13 at 11:37

Murtuza Kabul

6,438
6
27
34

So how would I do that? :\ – saintsfanuk Mar 26 '13 at 12:11
create a string with what you want in the placeholder and assign it to literal. It can be a complete html construct. Mind here that it will not behave as a server side control though. It will be pure html. – Murtuza Kabul Mar 26 '13 at 12:18
Sorry wasn't clear, I was referring to the first part of your answer which seemed the best thing to use. – saintsfanuk Mar 26 '13 at 12:42
The result of your api call can either be a .Net datatable or list and it is possible if you are using asp.net web service as api provider. It will be able to create a pseudo class in your application and transparently refer to the service. However, to use it, you should either have control over api or you should have asp.net web services rendering the api. – Murtuza Kabul Mar 26 '13 at 12:46

ASP.net best way to create this table?

3 Answers3