CODEWITHSUNDEEP
ajaxeventsjscrollpanejquery-jscrollpane
Gilberto Albino
Gilberto Albino

Reputation: 2745

Stop event propagation on jscrollpane jsp-scroll-y event for AJAX request

I am running accross a situation!

I am trying to update the content inside a jscrollpane whenever the user scrolls to the very bottom of the scrollbar.

Not having found a solution, I tried to send an ajax request when the scrollbar is atBottom.

However, everytime the scrollbar get atBottom, the event enter a non-stopping running process.

I tried to use event.stopPropagation(), but unsuccessfully!

Here is the code I am working:

$( 'div.scroll-pane-produts' ).bind( 'jsp-scroll-y',
    function( event, scrollPositionY, isAtTop, isAtBottom ) {
        if( isAtBottom ) {
            event.stopPropagation();
            // $.post('some-url');
            alert('infinite alerts from here');
        }   
    }
).jScrollPane();

Although the question itself relate to event from jscrollpane, I'd also appreciate another solution for updating the DIV content through an ajax request!

Thanks in advance...

Upvotes: 1

Views: 874

Answers (1)

Hanna
Hanna

Reputation: 10753

This isn't a direct answer to this question, but I stumbled here through Google because my scrollbar kept firing events over and over again even when I wasn't scrolling.

Turns out it's because I was using autoReinitalise which just reinitialized the scrollbar every 500 milliseconds, regardless of whether or not content has been added/removed the the region.

I added in some code to stop this from happening. My added code will prevent it from firing unless the height has changed.

First, I added a variable called prevHeight and set it to 0.

Then around line 229 I adjusted the code:

if (settings.autoReinitialise && !reinitialiseInterval) {
     reinitialiseInterval = setInterval(
          function () {
               var clientHeight = pane[0].clientHeight; //Add this line of code
               if (prevHeight !== clientHeight || prevHeight === 0) { //Add this condition
                    initialise(settings);
                }
                prevHeight = clientHeight ; //Add this line of code
            },
            settings.autoReinitialiseDelay
     );
}

NOTE: I only care about the vertical scrollbar, I'm not using any horizontal scrollbars. You'll want to have two checks (one for vertical and one for horizontal) if you care about both. You'd just make a prevWidth variable and check it against the `pane[0].clientWidth.

This fixed my problem, and hopefully it helps some others who come across this page.

Upvotes: 0

Related Questions