Forums › Forums › Search & Filter Pro › 'All posts loaded' message on Infinite Scroll

Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Anonymous
    (Private)  May 5, 2017 at 11:34 am #106703

    Hey guys,
    first of all thank you so much for saving my a$$ with this amazing plugin, I can’t explain how much time it made me save. thank you!

    I’m using the infinite scroll and I’m showing a loading message while the items are loading:

       jQuery(document).on("sf:ajaxstart",function(){
      jQuery('#infinite-loader').show();
    });

    jQuery(document).on("sf:ajaxfinish",function(){
      jQuery('#infinite-loader').hide();
    });

    This works perfectly, however it will appear once again when there are no more results to show, then disappear and leave the user with actually no further results, creating a bit of misunderstanding for some of them as they might think more results are supposed to appear.

    So I was wondering, is there a way to show an element of my DOM when there are no more results so that I can display a message or something to the user?

    Thank you.

    Trevor
    (Private)  May 5, 2017 at 12:21 pm #106726

    I would need to refer this to the developer, Ross, for an answer.

    Ross Moderator
    (Private)  May 5, 2017 at 12:38 pm #106738

    Hi Pelly

    Do you mean when you you reached the last “page” of results, and it shows the loading 1 more time, then finishes and hides itself?

    We actually added something for this.

    In your template, in your “end of results” message (which will be inside your “ajax container”), all you need to do is add an attribute, to any element in your end of results message: data-search-filter-action='infinite-scroll-end'

    Take a look at our infinite scroll template – search-filter-pro/templates/results-infinite-scroll.php, you will find and example of this usage 🙂

    Thanks

    Anonymous
    (Private)  May 5, 2017 at 2:07 pm #106754

    Wow that was quick, thanks Ross! Yes that’s definitely what I need, thanks so much for including that in your API however I tried to put it inside the Ajax Container and the message appears as soon as the page loads and will never disappear. Do I have to assign some CSS to it to hide it when not needed? Tried with visibility:hidden and it won’t show up when needed.

    Here is my code, where #job-results is the Ajax Container: https://pastebin.com/KpeWgUhP

    Sorry to bother, if it’s too much hassle just leave it! 🙂

    Thanks.

    Anonymous
    (Private)  May 8, 2017 at 1:29 pm #107200

    Ross hi, did you get a chance to look at my code? 🙂

    Thanks!

    Ross Moderator
    (Private)  May 10, 2017 at 9:18 am #107905

    Hey Pelly

    Sorry for the delay.

    Ahh I see the issue, you added data-search-filter-action="infinite-scroll-end", in a place, where no matter the query, this is always present – which will force the end of your infinite scroll, even when valid results.

    This code data-search-filter-action="infinite-scroll-end" needs to be in the part of your template that is shown, only when you have no results.

    I would suggest to remove the line:

    <div id="infinite-no-more" data-search-filter-action="infinite-scroll-end"><span>No more Jobs to show.</span></div>

    And then change the line (29):
    <p><?php _e( 'Sorry, no jobs matched your criteria.' ); ?></p>

    To

    <p data-search-filter-action="infinite-scroll-end"><?php _e( 'Sorry, no jobs matched your criteria.' ); ?></p>

    Because this is in your else, it will only trigger when there are no results left (ie, end of list)

    Best

    Anonymous
    (Private)  May 10, 2017 at 10:11 am #107915

    Hi Ross, no problem at all!
    There must be something wrong with my query then, as I’ve already tried to put the message in the else statement but it never appears.

    Isn’t <?php _e( 'Sorry, no jobs matched your criteria.' ); ?> supposed to appear only when zero posts exist for that query? I didn’t think its purpose was to appear at the end of the pages when there is content in the query?

    Anyway thanks for the hint, I’ll keep playing around with it and maybe I’ll try to rewrite the query in a way more similar to the one you provide in your results-infinite-scroll.php file!

    Ross Moderator
    (Private)  May 12, 2017 at 3:50 pm #108505

    Hey Pelly

    Just to test the functionality, you could create a new search form, use the “shortcode display method”, then actually use the template by following instructions here:

    https://www.designsandcode.com/documentation/search-filter-pro/search-results/using-a-shortcode/#Customising_the_Results

    but in this instance use results-infinite-scroll.php as the template.

    Once you configure the settings, you’ll be able to see how the intended functionality works, this might give an idea on how you should apply that logic to your code!

    (if you have trouble with the settings, let me know and I can help)

    Thanks

    Anonymous
    (Private)  May 15, 2017 at 9:54 am #108791

    Thanks a lot Ross I really appreciate the time you take to help me! I’m abroad now but will definitely give it a try as soon as I come back.

    Thank you!

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)