开发者

Displaying gridview with 3 columns

I have a gallery which holds a large number of thumbnail images and I want to show 6 at a time.

I have this working using the code below, but I can not get the images to display as 2 rows of 3 - it shows as 6 rows of 1.

I can get the desired result by using a datalist but that stops the pageindex function from working.

I'm sure there's an easy solution but I can't figure it out.

<asp:GridView id="GridView1" runat="server" AutoGenerateColumns="False" AllowPaging="True" PageSize="6" onpageindexchanging="PageIndexChanged" PagerSettings-Mode="NextPrevious" PagerSettings-NextPageText="Next"  PagerSettings-PreviousPageText="Previous">
    <Columns>
        <asp:TemplateField>
            <itemtemplate>
                <asp:Image ID="Image2" runat="server" ImageUrl='<%# Eval("userID", "/imageUpload/Handler.ashx?userID={0}&image=2")%>' ></asp:Image>
            </i开发者_如何学运维temtemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>


You want to use a ListView.. Look at MSDN here: http://msdn.microsoft.com/en-us/library/bb398790.aspx Most particularly the GROUPING option.


You might want to consider using a simple asp.net repeater control, and render your items as DIVs. You can use CSS "float" directive to cause your DIVs to automatically "wrap" within their container, to efficiently fit the space (very similar to the way text "wraps" within a text box when it reaches the end of the line).

Because they wrap dynamically, float'd DIVs can be a little more user-friendly: if your user has a wide high-resolution screen, maybe the images render as a 1x6 row. If your user shrinks their browser window, the DIVs will automatically re-arrange themselves into a 3x2 grid.

You wouldn't get data-paging behavior for free, but it's not difficult to implement on its own.


You'd probably be happier with a different control (repeater, etc.)... Gridviews are limited in that they match your datasource row-for-row.

If you have to do this in a gridview for some reason, one option would be to modify the SELECT in your data source so that it put your images into 3 columns. You might be able to do that with a pivot and rownumber() function, or other ways. Once you did that, you'd modify your grideview (copy your template column two more times).

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜