Using buttons for search criteria

Anonymous

#67366

Hi there!

I am very new to search & filter pro, so I need you guidance.

I am building a webpage using the Divi template and plugin (I do not know if you are aware of it), and I want to have a two column page where on the left side I will have buttons that when I press them, they will act as search criteria and on the right column I will be getting the search results from the tags of the posts that I have.

Any input on that?

Thanks!

Leonidas

Trevor

#67399

Either the buttons can have a link with query string attached, but that would cause a page reload, OR you could have some javascript attached, to change values in a hidden form, which in turn would trigger the results change.

Another user an almost identical question recently:

https://support.searchandfilter.com/forums/topic/execute-ajax-request-using-javascript/

I even gave him some example code.

Anonymous

#70022

Hello there again!

Sorry for my late reply but it took me some while to get up to speed with jQuery and Javascript.

So now my question would be the following:

I want to have a button class and various buttons with different id’s. These buttons, upon clicking them will enact the search and provide the results in a container using Ajax. My idea was something like the following:

<script type="text/javascript">
document.getElementById("myButton").onclick=function() {

}
</script>

In between the curly brackets would go the request for search.

My problem is that I do not know what to put there i.e. a shortcode? the different inputs? That will enable the search and alter the results.

Also by adding the results container in the settings of your program will automatically show the results in there? In what format do the results go? The reason I am asking is because I am using the Divi theme if you know it and I want to find a way for your output to be input for them to show the results (or at lease sth equivalent)

Thank you for your help, either way!

Leonidas

Trevor

#70110

The script would more likely look like this:

<script type="text/javascript">
jQuery(document).ready(function($){
  document.getElementById("myButton").onclick=function() {
    $('.myselectorclassname').val('hello');
  }
});
</script>

Exactly what your code will look like depends on what it is you are doing and want to achieve, and stackexchange is the best place to look for examples. The way I have written the code above
is not how WordPress would say to do it, but it generally works for me.
If you have a results shortcode on a page, that page should put the results there, yes.

Anonymous

#70379

Dear trevor,

Thank you for your kind response!

Just to understand something here, don’t you need some input arguments for your program’s functions in order to search for the posts or projects under “countries” for example? How could I make various buttons with different iD’s that could serve as “and” input for your search i.e. search for countries and profession, or as many criteria as I would want to?

Last, the results shortcodes have some specific class? I am asking because I want to have them presented on the website under certain styling etc. (css).

Once again thank you for your help!

Leonidas

Trevor

#70490

The HTML element that the results are wrapped in depends on the Display results method chosen. If using our Shortcode method, you can edit the example results.php file (see here for how), but my default it has a containing tag like this (depending on the form ID):

<div class="search-filter-results" id="search-filter-results-255">

I have re-read the thread. I need to get a better handle on what you want to do and what the page would look like. Have you sketched out the idea in visual form? Maybe you could upload an image to a file sharing site and give me a link?

Anonymous

#71346

Hello again,

So please find below a link for the picture:

https://www.dropbox.com/s/2d1rgmay0696nto/Website%20outline.JPG?dl=0

Is it clearer now? As you can see, I want to enable the search for various criteria upon checking the left side icons.

Thanks

Trevor

#71351

These buttons are, in effect, like categories? Is the list of choices fairly static (not changing much)?

Anonymous

#71355

Yes exactly, they are categories (in fact they are food categories). They should be fairly static, but I was thinking I could Get/post the category id and then alter the results using ajax as I previously mentioned.

Trevor

#71362

Why not make the Search & Filter form have them as category checkboxes, and use CSS to make them look like these buttons? Far less work.

[Author]

Posts