Search form using select field options in query

Question

I've made a search form using select tags with options. I would like to use each option selected to submit to the search query. I'm using Wordpress. Below is my form:

function categories_header_form()
{
?>
  <div id="header-form">
    <h3 class="form-title">
        <?php echo 'Αναζήτηση προϊόντων ανά περιοχή' ?>
    </h3>
    <form id="search-form" action="<?php bloginfo('url'); ?>" method="get" >
      <div class="form-container">

        <?php nomoi(); ?>

        <?php products_selection(); ?>

        <button type="submit" class="button" id="search-form-button">Εύρεση</button>
      </div>
    </form>
  </div>
<?php
}

And the two function for the select dropdowns:

function products_selection()
{
    $args = array(
      'post_type'   => 'seller',
      'taxonomy'    => 'category',
      'hide_empty'  => 0,
      'exclude'     => 1,1078,1079
    );
    $products = get_categories( $args );

    if ( $products ) {
    echo '<select id="products-select">';
      echo '<option selected="" disabled="" value="0"><span>Προϊόντα</span></option>';

      foreach ($products as $product) {
        echo '<option class="product-name" id="'. $product->term_id .'">'. $product->name .'</option>';
      }
    echo '</select>';
  }
}

function nomoi()
{
  $args = array(
    'post_type' => 'seller',
    'taxonomy'  => 'nomos',
    'hide_empty'=> 0,
    'parent'    => 0
  );

  $categories = get_categories( $args );

  if ( $categories ) {
    echo '<select id="nomoi-select" name="nomoi">';
      echo '<option selected="selected" disabled="disabled"><span>Νομοί</span></option>';

      foreach ( $categories as $category ) {
        $id = $category->term_id;
        $name = $category->name;
        echo '<option class="nomos" id="'. $id .'">'. $name .'</option>';
      }
    echo '</select>';
    echo '<select id="towns-select" name="towns">';
      echo '<option class="town-disabled" selected="selected" disabled="disabled"><span>Πόλεις</span></option>';
    echo '</select>';
  }
}

Just to make sure I understand, you want the form to submit when a user changes one of the select fields? — TomDillinger, Jul 28 '15 at 01:28
No. The form has a submit button. I don't no how to get the values from each selected option and include them in the search. The form suppose to get the sellers related to the town given in the select box(and related to the products, which is the next select box) — vagelis, Jul 28 '15 at 08:59
You want a user to be able to select multiple options? Or you don't understand how to handle the data sent by the form? — TomDillinger, Jul 28 '15 at 22:18
TomDillinger both. The user will select an option from all three and their values should be used to perform the query and result should be posts that has those 3 values related. — vagelis, Jul 28 '15 at 23:00

score 0 · Answer 1 · edited May 23 '17 at 12:21

0

Using Jquery you can have a form submit when a user changes the select field.

$('select').change(function ()
{
    $(this).closest('form').submit();
});

See: Submit Form for select option.onClick

edited May 23 '17 at 12:21

Community

1
1

answered Jul 28 '15 at 01:30

TomDillinger

194
7

TomDillinger thank you for the help. I've managed to make it work with the use of the default wordpress search. Could not manage to add thought the categories in the search query. – vagelis Jul 29 '15 at 15:39

Search form using select field options in query

1 Answers1