如何显示基于选定值的搜索表单

Question

I have the following function for a custom search in WordPress:

function my_search_form( $form ) {
  $form = '
  <div class="custom-search-dropdown">
    <div class="select-wrapper">
      <select class="blog-store-select">
        <option value="blog">BLOG</option>
        <option value="store">STORE</option>
      </select>
    </div>

    <form role="search" method="get" class="searchform" action="' . home_url( '/' ) . '" >
      <input type="text" value="' . get_search_query() . '" name="s" class="s" placeholder="Site search" />
      <input type="submit" id="searchsubmit" class="search-btn" value="'. esc_attr__( '&#xf002;' ) .'" />
    </form>
  </div>';

    return $form;
}

I have a select dropdown:

 <select class="blog-store-select">
  <option value="blog">BLOG</option>
  <option value="store">STORE</option>
</select>

What I am trying to do is either use the regular WP search if the Blog option is selected from the dropdown, or if store is selected, grab the value from the search and open a new window with the search parameter passed into a url that I will set.

I know I can get the select value using JavaScript with a onChange function - but I am not sure how to handle this inside of php / WordPress. Any direction, or articles are very much appreciated.

Thank you so much!

Answer 1

Set the name of your select to post_type , then the value of the select must match the name of the post_type, for example: blog, the post type name is post .

Wordpress search query will interpret the post_type var and will only search on the given post_type ,

<form role="search" method="get" class="searchform" action="' . home_url( '/' ) . '" >
      <input type="text" value="' . get_search_query() . '" name="s" class="s" placeholder="Site search" />
      <select class="blog-store-select" name="post_type">
        <option value="post">BLOG</option>
        <option value="store">STORE</option>
      <input type="submit" id="searchsubmit" class="search-btn" value="'. esc_attr__( '&#xf002;' ) .'" />
</select>