Solved

how to show product like 4 column each row

Posted on 2011-02-22
6
265 Views
Last Modified: 2012-05-11
Hi experts

I used to show product in rows with datalist
like

img 1   / product1e  / detailed information /price
img 2   / product1e  / detailed information /price
img 3   / product1e  / detailed information /price
...
...
img 87   / product1e  / detailed information /price  

each row for one product
I wonder if I can show 4 product in one row
shows like this
                    img1     |    img2   |  img3   | img4
 row1          name    |   name2| name3| name4
                    price    |   price2  | price3| price4
                   -----------------------------------------
                   img5     |    img6   |  img7   | img8
 row2          name5    |   name6| name7| name8
                    price5    |   price6  | price7| price8

data are read from database
dont know how many products in total
is there a solution for that?

thx
0
Comment
Question by:hukaka
  • 3
  • 2
6 Comments
 
LVL 52

Accepted Solution

by:
Carl Tawn earned 500 total points
ID: 34955253
You should be able to do that with the DataList already simply by setting the RepeatDirection to "Horizontal" and the RepeatColumns to "4".
0
 

Author Comment

by:hukaka
ID: 34955375
will try that
thanks carl
0
 
LVL 14

Expert Comment

by:quizwedge
ID: 34955591
For the page, use a repeater instead of a datalist. Use the following code:

<table border="0" cellpadding="0" cellspacing="0" width="100%">
            <asp:Repeater ID="rptTest" runat="server" OnItemDataBound="rptTest_ItemDataBound">
                <ItemTemplate>
                    <asp:Label ID="lblHeader" runat="server" Text="<tr>" Visible="false" />
                    <td style="width:25%;">
                        Image<br />
                        Name<br />
                        Price<br />
                        <br />
                    </td>
                    <asp:Label ID="lblFooter" runat="Server" Text="</tr>" Visible="false" />
                </ItemTemplate>
                <AlternatingItemTemplate>
                    <asp:Label ID="lblHeader" runat="server" Text="<tr>" Visible="false" />
                    <td style="width:25%;">
                        Image<br />
                        Name<br />
                        Price<br />
                        <br />
                    </td>
                    <asp:Label ID="lblFooter" runat="Server" Text="</tr>" Visible="false" />
                </AlternatingItemTemplate>
                <FooterTemplate>
                    <asp:Label ID="lblFooterCleanup" runat="server" Text="" Visible="false" />
                </FooterTemplate>
            </asp:Repeater>
</table>

Open in new window


You'll want this in the code behind:
 protected void rptTest_ItemDataBound(object sender, RepeaterItemEventArgs e)
        {
            if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
            {              
                if (e.Item.ItemIndex % 4 == 0)
                {
                    ((Label)e.Item.FindControl("lblHeader")).Visible = true;    
                }
                else if (e.Item.ItemIndex % 4 == 3)
                {
                    ((Label)e.Item.FindControl("lblFooter")).Visible = true;
                }
            }
            else if (e.Item.ItemType == ListItemType.Footer)
            {
                if (rptTest.Items.Count % 4 == 0)
                {
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Text = "<td style=\"width:25%;\">&nbsp;</td><td style=\"width:25%;\">&nbsp;</td><td style=\"width:25%;\">&nbsp;</td></tr>";
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Visible = true;
                }
                else if (rptTest.Items.Count % 4 == 1)
                {
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Text = "<td style=\"width:25%;\">&nbsp;</td><td style=\"width:25%;\">&nbsp;</td></tr>";
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Visible = true;
                }
                elseif (rptTest.Items.Count % 4 == 2)
                {
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Text = "<td style=\"width:25%;\">&nbsp;</td></tr>";
                    ((Label)e.Item.FindControl("lblFooterCleanup")).Visible = true;
                }
            }
        }

Open in new window

0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 
LVL 14

Expert Comment

by:quizwedge
ID: 34955603
Though if @carl_tawn's solution works, that would be more elegant. I started working on my solution before he posted his, so figured I'd post mine anyway.
0
 

Author Comment

by:hukaka
ID: 34956395
thanks for your time quiz
carl's solution works
your code can be useful if I have to do something more complex  
0
 
LVL 14

Expert Comment

by:quizwedge
ID: 34956414
NP. I learned something too. :)
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
Performance in games development is paramount: every microsecond counts to be able to do everything in less than 33ms (aiming at 16ms). C# foreach statement is one of the worst performance killers, and here I explain why.
This video shows how to use Hyena, from SystemTools Software, to bulk import 100 user accounts from an external text file. View in 1080p for best video quality.
The Email Laundry PDF encryption service allows companies to send confidential encrypted  emails to anybody. The PDF document can also contain attachments that are embedded in the encrypted PDF. The password is randomly generated by The Email Laundr…

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question