Javascript issue on page load & scroll

A javascript function scrollPage() is c开发者_运维问答alled on page load , this function continuously loads products when page is scrolled to bottom using Ajax.When first time page is loaded 20 products are shown by default.

I have a price slider on the same page when users moves the price slider it filters products and products falling on the selected price range is displayed using Ajax. Here also if there are more than 20 filtered product then first 20 product will be displayed by default and then on scroll rest products will be displayed. To achieve this I have again called the scrollPage() function onPriceSlide() with different parameters.

The problem is that when user scrolls down after filtering the products it is still loading all the products on scroll.

Any suggestion how can I can fix it using Prototype JS ?

---

Seems like you have two ajax responses and you need to cancel the first one. If that is the case set a variable on your second ajax request, that cancels out the 1st one. Your ajax response function should always check for this variable and if if true, it exits out, deletes it and does nothing.

---

It sounds like you've got a scroll event listener still hanging around somewhere. You'll have to detach it using Event.stopObserving.

Edit:

Here's a working example: http://jsfiddle.net/vuSQa/

If you're not seeing anything: this code logs scroll events to your browser's JS console (Ctrl-Shift-J in many browsers).