This is a migrated thread and some comments may be shown as answers.

scrollTo after load scrollview

8 Answers 81 Views
ScrollView (Mobile)
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 12 Mar 2014, 03:16 PM
Hi!

I need to do a scrollTo just after load an scrollview. If i put my function just after loading code it do anything. If put the same sentence with a 1 second delay using setTimeout it works great. Then, there's one event at kendoMobileScrollView that throws when the load it's complete to call my sentence at this place?

Thanks

PD: This is my loading function:

function CargaDatos(){
$("#scrollview").kendoMobileScrollView({
        dataSource: {
            transport: {
            read: function (options) {

                db.transaction(function(tx) {

///WEB SQL LOADING CODE OMMITED, TOO EXTEND.

});

            }
        },
            serverPaging: true,
            pageSize: pagElements*9,
            schema: {
            data: "photos",
            total: "total_items"
        }
        },
        itemsPerPage: pagElements,
        template: kendoTemplate,
        contentHeight: '100%',
        enablePager: false
    });
    
    setTimeout('$("#scrollview").data("kendoMobileScrollView").scrollTo(6, true);',1000);
}

8 Answers, 1 is accepted

Sort by
0
Kiril Nikolov
Telerik team
answered on 13 Mar 2014, 08:26 AM
Hi David,

You can use the View's afterShow event and there you can scroll to the desired element of the scrollview. Please check the following example:

http://jsbin.com/jabaz/1/edit

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
David
Top achievements
Rank 1
answered on 13 Mar 2014, 09:13 AM
Hi, It doesn't works. It do anything. I put an alert in my webSqlLoad function and one in my afterShow function the afterShow fires before websqlload.

It's seems that it's because the read function is asyncrhonous. Is any event at Scrollview load?
0
David
Top achievements
Rank 1
answered on 14 Mar 2014, 09:15 AM
Hi, This is my example loading with WebSql database. If I try to navigate to page 5 it works. If my page is 6 or greather it fails. I think that I fails when I try to navigate to a page that is not loaded yet. I'm forgetting something??

Thanks
0
David
Top achievements
Rank 1
answered on 14 Mar 2014, 09:19 AM
I attached here my sample code.
0
David
Top achievements
Rank 1
answered on 14 Mar 2014, 09:21 AM
Seems that is a problem with attached files. I give you the code by jsbin:

http://jsbin.com/rofokula/2/edit
0
Kiril Nikolov
Telerik team
answered on 14 Mar 2014, 01:20 PM
Hi David,

Thank you very much for your project, it really helped narrowing down the issue.

In your case you can approach the problem in two different ways:

1) If you want to navigate to one and the same page every time you open the view, you can set the page property of the widget, as shown in this example:

http://docs.telerik.com/kendo-ui/api/mobile/scrollview#configuration-page

2) If you want to navigate to different pages, and not set it as a static property, you can use the fetch() method of the dataSource and pass a callback handling the scrolling as in this example:

http://jsbin.com/rofokula/2/edit

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
David
Top achievements
Rank 1
answered on 17 Mar 2014, 08:19 AM
Sorry, second link is wrong, Is that same that I sent to you
0
Kiril Nikolov
Telerik team
answered on 18 Mar 2014, 11:28 AM
Hello David,

It looks like the jsBin is not saving project with local database inside. Anyway, please find the updated project attached.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
ScrollView (Mobile)
Asked by
David
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
David
Top achievements
Rank 1
Share this question
or