0

I have an auto-complete list, in the list I use the scrolling of iscroll 4: http://cubiq.org/iscroll-4 for Mobile.(Html5 + PhoneGap for Android)

When writing a letter in the input (AutoComplete is turned on) I called to a function that refresh the scroll, Because each time write a letter the size of the list changes.

My refresh function:

function RefreshScroll() {
    MyScroll.scrollToElement('li:nth-child(1)', 100)// Jump to the first element
    setTimeout(function () {
        MyScroll.refresh();// Refresh scroll bar -function of iscroll 4
    }, 0);
}

My scroll:

document.addEventListener('DOMContentLoaded', LoadScroll, false);

var myScroll;

function LoadScroll() {
    document.addEventListener('touchmove', function (e) { e.preventDefault(); });
    myScroll= new iScroll('wrapper');
}

I have several problems:

  1. The first time I press the keyboard letter the list appears without scrolling, only on clicking the second letter scroll appears.

  2. The second time when the scroll appears and I scroll down, when reach the end of the list instead of jumping back he goes down as the list goes on.

Can anyone help me?

Hodaya Shalom
  • 4,327
  • 12
  • 57
  • 111

1 Answers1

0

Finally I solved the problem this way:

Because it takes time for AutoComplete to fill, I refresh the scroll only after some time.

I changed the function:

function RefreshScroll() {
    setTimeout(function () {
        MyScroll.scrollToElement('li:nth-child(1)', 100)
        setTimeout(function () {
            MyScroll.refresh();
        }, 0);
    }, 200);
}

This solved both problems, probably every time it loads the previous list scrolling

Hodaya Shalom
  • 4,327
  • 12
  • 57
  • 111