[Resolved] Jump to results div on clicking Search

[Author]

Posts

[brentE]

I'm referring to this question from another user a couple of years ago: https://toolset.com/forums/topic/jump-to-search-results-upon-clicking-search-submit-button/ The JS provided at the time is below.

I'm trying to achieve the same thing: when a user clicks FIND the page will scroll down to the div containing the results. I'm not clear on a couple of things:

scrollTop: jQuery(".wp-block-spacer").offset().top
Is this looking for an element with the class 'wp-block-spacer'?

if(submit=="SEARCH") {
What is being looked for here?

The page is here: hidden link

Password maple (to keep search engines out.)

Any suggestions would be appreciated. As an aside, I'm using old-school Views on this page, not blocks.

-----------

jQuery( document ).ready(function( $ ) {

var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;

for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');

if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : sParameterName[1];
}
}
};
var submit = getUrlParameter('wpv_filter_submit');
if(submit=="SEARCH") {
jQuery('html, body').animate({
scrollTop: jQuery(".wp-block-spacer").offset().top
}, 'slow');
}

});

[Christopher Amirian]

Hi there,

for your use-case you can add the Javascript below to your view and it should work the way you want:

    document.addEventListener('DOMContentLoaded', function() {
        // Check if the URL contains the specific query string
        if (window.location.href.indexOf('?wpv_view_count') > -1) {
            var element = document.getElementById('wpv-view-layout-10853');
            
            if (element) {
                // Scroll to the element
                element.scrollIntoView({ behavior: 'smooth' });
            }
        }
    });

Thanks.

[brentE]

Perfect, thanks for the quick reply.