Solved

change listview layout

Posted on 2011-09-21
4
610 Views
Last Modified: 2012-12-14
hi i load some data on one listview but the data shows like this:
that the layout we have:

1          2          3          4
5          6          7          8
9         10        11

but i want this one:

1          4          7      10
2          5          8      11
3          6          9

any suggestion?
0
Comment
Question by:rafaelrgl
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 96

Accepted Solution

by:
Bob Learned earned 300 total points
ID: 36577921
It sounds like you are looking for something like this:

Repeating ListView GroupTemplate Vertically
http://forums.asp.net/p/1364813/2830987.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ListViewVertical.aspx.cs"
    Inherits="ListViewVertical" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ListView vertical Repeat demo</title>
    <style type="text/css">
        .header
        {
            clear: both;
            width: 100%;
            text-align: center;
            border: 1px solid #ccc;
        }
        .item
        {
            clear: both;
            border: 1px Blue solid;
            width: 100%;
        }
        .group
        {
            /* i used 200px ,because the main layout width is 600px , and the width for each group is 200px.*/
            width: 200px;
            border: 1px red solid;
            float: left;
            margin: 3px;
            padding: 2px;
        }
        .mainLayout
        {
            width: 640px;
            border: yellow 2px solid;
            padding: 2px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ListView ID="ListView1" GroupItemCount="3" runat="server" DataSourceID="ObjectDataSource1">
            <LayoutTemplate>
                <div runat="server" id="Products" class="mainLayout">
                    <div id="Tr1" runat="server" class="header">
                        PRODUCTS LIST
                    </div>
                    <div runat="server" id="groupPlaceholder">
                    </div>
                </div>
            </LayoutTemplate>
            <GroupTemplate>
                <div runat="server" id="ProductsGroup" class="group">
                    <asp:PlaceHolder runat="server" ID="itemPlaceholder" />
                </div>
            </GroupTemplate>
            <GroupSeparatorTemplate>
            </GroupSeparatorTemplate>
            <ItemTemplate>
                <div id="Td1" align="center" runat="server" class="item">
                    <asp:Label ID="Label1" runat="server" Text='<%#Eval("ProductId","ProductId: {0}") %>' /><br />
                    <asp:Label ID="Label2" runat="server" Text='<%#Eval("Name","Name: {0}") %>' /><br />
                </div>
            </ItemTemplate>
            <ItemSeparatorTemplate>
                <br />
            </ItemSeparatorTemplate>
        </asp:ListView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
            SelectMethod="GetAll" TypeName="Product">
            <SelectParameters>
                <asp:Parameter Type="Int32" Name="NumnerOfDummyProducts" DefaultValue="7" />
            </SelectParameters>
        </asp:ObjectDataSource>
    </div>
 
    </form>
</body>
</html>

Open in new window

0
 
LVL 4

Assisted Solution

by:guramrit
guramrit earned 200 total points
ID: 36579122
Check following code on any page.

 
<style type="text/css">
        .item
        {
            clear: both;
            width: 100%;
        }
        .group
        {
            float: left;
            margin: 3px;
            padding: 2px;
        }
    </style>

    <asp:ListView ID="ListView1" GroupItemCount="3" runat="server" DataSourceID="ObjectDataSource1">
        <LayoutTemplate>
            <div runat="server" id="Products" class="mainLayout">
                <div runat="server" id="groupPlaceholder">
                </div>
            </div>
        </LayoutTemplate>
        <GroupTemplate>
            <div runat="server" id="ProductsGroup" class="group">
                <asp:PlaceHolder runat="server" ID="itemPlaceholder" />
            </div>
        </GroupTemplate>
        <GroupSeparatorTemplate>
        </GroupSeparatorTemplate>
        <ItemTemplate>
            <div id="Td1" align="center" runat="server" class="item">
                <asp:Label ID="Label1" runat="server" Text='<%# Container.DataItem %>' />
            </div>
        </ItemTemplate>
    </asp:ListView>
    <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
        SelectMethod="Range" TypeName="System.Linq.Enumerable">
        <SelectParameters>
            <asp:Parameter Name="start" DefaultValue="1" />
            <asp:Parameter Name="count" DefaultValue="11" />
        </SelectParameters>
    </asp:ObjectDataSource>

Open in new window

0
 
LVL 1

Author Closing Comment

by:rafaelrgl
ID: 36585051
thanks a lots for this.
0
 

Expert Comment

by:simtouch
ID: 38691624
This does not even work did you not even check your code?
0

Featured Post

How Blockchain Is Impacting Every Industry

Blockchain expert Alex Tapscott talks to Acronis VP Frank Jablonski about this revolutionary technology and how it's making inroads into other industries and facets of everyday life.

Question has a verified solution.

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

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
This article explains how to reset the password of the sa account on a Microsoft SQL Server.  The steps in this article work in SQL 2005, 2008, 2008 R2, 2012, 2014 and 2016.
Add bar graphs to Access queries using Unicode block characters. Graphs appear on every record in the color you want. Give life to numbers. Hopes this gives you ideas on visualizing your data in new ways ~ Create a calculated field in a query: …
Sometimes it takes a new vantage point, apart from our everyday security practices, to truly see our Active Directory (AD) vulnerabilities. We get used to implementing the same techniques and checking the same areas for a breach. This pattern can re…

622 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