Binding ListView directly to a list of objects

6 posts, 0 answers
  1. David
    David avatar
    7 posts
    Member since:
    Oct 2011

    Posted 14 Aug 2012 Link to this post

    I am trying to use the MVC extensions to bind directly to a list of objects.  The data is part of the model that is passed to the view.  I don't want the list view to make an extra call just to get data that is already available.  I am trying to use a combination of BindTo() and ClientTemplateId(), but the resulting list is always empty.
  2. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 15 Aug 2012 Link to this post

    Hello David,

    The following configuration will bind the ListView with the data set from server. This will not cause additional request initially.

    <script type="text/x-kendo-tmpl" id="template">
        <div class="product">
            <img src="<%=Url.Content("~/content/web/foods/")%>${ProductID}.jpg" alt="${ProductName} image" />
            <h3>${ProductName}</h3>
            <dl>
                <dt>Price:</dt>
                <dd>${kendo.toString(UnitPrice, "c")}</dd>
            </dl>
        </div>
    </script>
     
    <%: Html.Kendo().ListView<Kendo.Mvc.Examples.Models.ProductViewModel>(Model)
        .Name("listView")
        .TagName("div")
        .BindTo( new [] { new Kendo.Mvc.Examples.Models.ProductViewModel { ProductID = 1, UnitPrice = 10 } })
        .ClientTemplateId("template")
        .DataSource(dataSource => {
            dataSource.Read(read => read.Action("Products_Read", "ListView"));
            dataSource.PageSize(12);
        })
        .Pageable()
    %>


    All the best,
    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. moti
    moti avatar
    27 posts
    Member since:
    May 2011

    Posted 10 Sep 2012 Link to this post

    Hi

    this is not working.

    i want to bind the list view to

    IEnumerable<myClass>  myServerList
    but this is not working.

    i also dont understand if the ListView is bound to the server object myServerList
    , why we need to add this:
    dataSource.Read(read => read.Action("Products_Read", "ListView"));
    i actually dont have any action/controller that support that
    so i just put
    dataSource.Read(read => read.Action("BBB", "AAA"));

    this is not working, the Model.myServerList has 20 records, none of them is shown..

    thanks for any help

    moti

  5. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 13 Sep 2012 Link to this post

    Hello Moti,

    The ListView widget supports only ajax binding. This why you need to defined DataSource.Read method as any page attempt will result in calling the method.

    You can however bind the ListView from data provided initially on server (in the initialization Html.Kendo().ListView(Model) or with BindTo(...)) as on the snippet from my previous post. That data will be serialized on client and bind the widget.

    Regards,
    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Josh
    Josh avatar
    50 posts
    Member since:
    Jul 2009

    Posted 16 May 2013 Link to this post

    This does not work.

    See the following code:

     @(Html.Kendo().ListView<Imagine.Models.NavigationItem>()
                .Name("lvForm_Navigation")
                .TagName("fieldset")
                .HtmlAttributes(new { @class = "side-nav-section" })
                .ClientTemplateId("ttNavigationItem")
                .BindTo(new Imagine.Models.NavigationItem[] { new Imagine.Models.NavigationItem { Title="test" }})        
            )

    Binding the listview directly does not work either using BindTo or binding directly.

    I am using v2013.1.319
  7. Josh
    Josh avatar
    50 posts
    Member since:
    Jul 2009

    Posted 17 May 2013 Link to this post

    I retract my previous post.  This does work, in my case my script reference to the kendo.aspnetmvc.js file was incorrect. Without this script the binding will silently fail.  (no errors)
Back to Top
Kendo UI is VS 2017 Ready