Tell us what you are trying to do?
I want to hide results on the page until the user clicks the submit button.
I do not want the search results on a new page.
Is there any documentation that you are following?
I have searched through several different options, but they don't work.
Help?
Is there a similar example that we can see?
No.
What is the link to your site?
hidden link
Hi Eric,
Thank you for contacting us and I'll be happy to assist.
To show the view's results, only when the submit button is clicked, you can add the following script, in the "JS editor" tab under the "Search and Pagination" section.
( example screenshot: hidden link )
// hide results on page load
jQuery('.js-wpv-view-layout').hide();
// show results when the search button is clicked
jQuery('.wpv-submit-trigger').click(function() {
jQuery('.js-wpv-view-layout').show();
});
I hope this helps and for more personalized assistance around custom code/script, you can also consider hiring a professional from our list of recommended contractors:
https://toolset.com/contractors/
regards,
Waqar
That works wonderfully, Waqar!
However, I have other view items on the page and it hides them as well.
Thoughts?
Hi Eric,
Thanks for the update and glad it works.
To make the code more specific and target only the specific view's container, you can update both instances of class names to include that View's ID:
// hide results on page load
jQuery('.js-wpv-view-layout-1897').hide();
// show results when the search button is clicked
jQuery('.wpv-submit-trigger').click(function() {
jQuery('.js-wpv-view-layout-1897').show();
});
Note: You can use Google's inspect element tool to see the page's markup and the applied styles, as explained in this guide:
hidden link
regards,
Waqar
My issue is resolved now. Thank you!
Great help and so prompt!
Perfection!