Boostrap Style Layout

[Colin Wright]

Hi,

I am in the process of converting to an Kendo MVC application and using a bootstrap style framework.

I was looking for an example in Kendo ListView that I could achieve in a RadListView with the following code. Setting pagesize to 3 and displaying 3 items horizontally.

<telerik:RadListView ID="RadListView1" runat="server" OnNeedDataSource="RadListView1_NeedDataSource" ItemPlaceholderID="PlaceHolder1" PageSize="3" AllowPaging="true" Width="100%">
                       <LayoutTemplate>
                           <div class="row uniform">
                               <asp:PlaceHolder ID="PlaceHolder1" runat="server" />
                           </div>
                       </LayoutTemplate>
                       <ItemTemplate>

                           <div class="4u 12u(narrower)">
                               <div class="boxwrapper style1">
                                   <section class="box special">
                                       <span class="image fit">
                                           <telerik:RadBinaryImage ID="RadBinaryImage2" runat="server" AutoAdjustImageControlSize="false" DataValue='<%#Eval("ArticleImage") %>' />
                                       </span>
                                       <h5><%# DataBinder.Eval(Container, "DataItem.Title")%></h5>
                                       <a class="button" href='<%#Eval("ID", "ShowArticle.aspx?id={0}") %>'>Learn More..</a>
                                   </section>
                               </div>
                           </div>

                       </ItemTemplate>
                   </telerik:RadListView>

[Danail Vasilev]

Hello Colin,

The ListView / Basic usage demo shows how to display horizontally items with CSS. You can just set the pageSize to 3 - http://dojo.telerik.com/OtuJI

Regarding the RadListView control I have modified the RadListView - Telerik ASP.NET ListView demo with your approach but the listview items are not aligned horizontally - http://screencast.com/t/MInCVJ8z. You can find the attached page I have used for the testing as well.

Regards,
Danail Vasilev
Telerik by Progress