duplicate pull to refresh label

3 posts, 0 answers
  1. Daniele
    Daniele avatar
    8 posts
    Member since:
    Sep 2012

    Posted 27 Sep 2012 Link to this post

    Hello,
    If I write:

    <div data-role="view" id="offers" data-layout="general-home" data-title="Offers" data-show="filterOffers">
                <ul id="pull-to-refresh-offers"></ul>
            </div>
            <script id="productsTemplate" type="text/x-kendo-template">
                <div class="content_offers">
                <span class="title">#= NAME #</span>
                </div>
            </script>


    and:

    function filterOffers(e) {
         
        var scroller = e.view.scroller;
        scroller.reset();
        categoryID = parseInt(e.view.params.CategoryID);
         
        //console.log(categoryID);
         
        var getOffers = new kendo.data.DataSource({
     transport: {
     read: {
     dataType: "jsonp",
                                                   
     beforeSend: function(req) {
     $("#pull-to-refresh-offers").hide();
     app.showLoading();
     },
                                                   
     data: {
        action: "getOffers",
        CategoryID: categoryID
        }
     }
     },
     change: function() {
     app.showLoading();
                                                   
     setTimeout(function() {
                                                              
     app.hideLoading();
     $("#pull-to-refresh-offers").show();
         }, 200);
                                                   
                                                   
             },
             schema: {
                 data: "res"
             }
             });
         
        $("#pull-to-refresh-offers").kendoMobileListView({
                   dataSource: getOffers,
                   pullToRefresh: true,
                   template: $("#productsTemplate").text()
              });
         
    }


    At the second time that I run the pull to refresh the "Pull to refresh" label is duplicate (see attached image)
  2. Daniele
    Daniele avatar
    8 posts
    Member since:
    Sep 2012

    Posted 29 Sep 2012 Link to this post

    up
  3. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2886 posts

    Posted 29 Sep 2012 Link to this post

    Hi Daniele,

    I believe the problem is caused by the multiple initialization of the ListView component. Mobile widgets should be initialized only once via data-attributes or through JavaScript in the init event handler (data-init).
    The same approach is used in this on line demo.

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top