ListView with kendoPager

2 posts, 1 answers
  1. Troy Clemons
    Troy Clemons avatar
    69 posts
    Member since:
    Apr 2010

    Posted 23 Apr 2014 Link to this post

    i have a list view and it is getting populated with remote data, the kendoPage with the exact same datasource comes
    back as no items to display.

    HTML
    <div class="layout-section">
            <div id="layoutView"></div>
            <div id="pager" class="k-pager-wrap" ></div>
    </div>
     
    <script type="text/x-kendo-template" id="template">
            <div class="product">
                    <img src="#= Layoutfilepath #" alt="#= LayoutName # Layout" />
                    <h3>#=LayoutName# Layout</h3>
                    <p>#:kendo.toString("Select Layout")#</p>
             </div>
    </script>

    Scripting

    var layouts2 = new kendo.data.DataSource({
                        transport: {
                            read: {
                                url: "Default.aspx/GetLayouts",
                                contentType: "application/json; charset=utf-8",
                                type: "POST",
                                dataType: "json"
                            }
                        },
                        schema: {
                            data: "d"
                        },
                        pageSize: 1
                    });
                     
                    $("#layoutView").kendoListView({
                        dataSource: layouts2,
                        template: kendo.template($("#template").html()),
                        selectable: "single"
                    });
     
                    $("#pager").kendoPager({
                        dataSource: layouts2
                    })


    Any thoughts
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 25 Apr 2014 Link to this post

    Hello Troy,

    The problem occurs the dataSource does not know its total number of records. You should either return the total amount of records with the server response and specify it at the schema.total.
    An alternative approach is to define custom total function like this:
    schema: {
      data: "d",
      total: function(data) {
        return data.d.length;
      }
    },

    I hope this information will help.

    Regards,
    Alexander Valchev
    Telerik
     
    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
Back to Top