ListView with more than 3 columns

2 posts, 0 answers
  1. Gary Meagher
    Gary Meagher avatar
    29 posts
    Member since:
    Jan 2010

    Posted 29 Nov 2010 Link to this post

    I'm using the sample you provided for RadListView with the following code
    <telerik:RadListView ID="listViewProducts" runat="server"
            onneeddatasource="listViewProducts_NeedDataSource" ItemPlaceholderID="ProductsHolder"
           DataKeyNames="ProductCatalogID" Width="1200px">
                      <AlternatingItemTemplate>
                      <div class="rlvA" style="height: 150px; width: 220px; margin-top: 5px; margin-left: 5px;
                                    margin-right: 5px; margin-bottom: 5px; padding-left: 15px;">
                      <asp:Panel ID="pnl" runat="server" Width="220px" CssClass="header4" >
                             <b> <%#Eval("Products")%></b>
                         
                            <div style="padding-left:20px;padding-top:20px;" >
                            <asp:ImageButton ID="ImageButton1" ImageUrl="~/Images/Product.jpg" PostBackUrl='<%# Eval("Link")%>' runat="server" />
                         </div>
                            </asp:Panel>
     
                                </div>
                            </AlternatingItemTemplate>
                            <ItemTemplate>
                            <div class="rlvI" style="height: 150px; width: 220px; margin-top: 5px; margin-left: 5px;
                                    margin-right: 5px; margin-bottom: 5px; padding-left: 15px;">
                             <asp:Panel ID="pnl" runat="server" Width="220px" CssClass="header4">
                              <b><%#Eval("Products")%></b>
                         
                            <div style="padding-left:20px;" >
                            <asp:ImageButton ID="btnSample" ImageUrl="~/Images/Product.jpg" PostBackUrl='<%# Eval("Link")%>' runat="server" />
                         </div>
                            </asp:Panel>
                            </div>
                            
                            </ItemTemplate>
                            <EmptyDataTemplate>
                                <div class="RadListView RadListView_Windows7">
                                    <div class="rlvEmpty">
                                        There are no items to be displayed.</div>
                                </div>
                            </EmptyDataTemplate>
                            <LayoutTemplate>
                                <div class="RadListView RadListViewFloated RadListView_Windows7">
                                    <div class="rlvFloated rlvAutoScroll">
                                        <div id="ProductsHolder" runat="server">
                                        </div>
                                    </div>
                                    <telerik:RadDataPager ID="RadDataPager1" runat="server" PageSize="7">
                                        <Fields>
                                            <telerik:RadDataPagerButtonField FieldType="Numeric" />
                                        </Fields>
                                    </telerik:RadDataPager>
                                </div>
                            </LayoutTemplate>
     
           
        </telerik:RadListView>

    There are a few issues:
    1. I cannot see the "Open Layout Editor" in design time
    2. How can I make the result show more than 3 columns? It seems the definition is in your Telerik css that I don't have access to.
    3. The DataPager is not working.

    Thanks for your help.

  2. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 02 Dec 2010 Link to this post

    Hi Gary,

    Regarding your fist question:
    The  Open Layout Editor link will be shown in design mode only if you have set declaratively the DataSourceID property of the RadListView and bind it to data source controls.

    With respect to your second question:
    I could not reproduce the described issue. I am sending you a simple example based on your code. Please check it out and let me know what differs in your case. Also on the following link I attached a simple video which demonstrates how the example works on my side.
    Additionally could you please verify that the RadListView control is not placed with other control with statically set width in pixels.

    Regarding your third question:
    You need to set the RadListView.AllowPaging property to true and the RadDataPager.PagedControlID property to listViewProducts. More information you could find on the following link:
    http://www.telerik.com/help/aspnet-ajax/datapager-for-listview-paging.html

    Looking forward for your reply.

    Greetings,
    Radoslav
    the Telerik team
    Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top