Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

General

Customize Simple search for dropdown select box

Started by bibi 5 years ago · 1 replies · 524 views

5 years ago

hello guys, i'm using simple search plugin.
My search box include 2 part:
part 1: the search input box,, user type here and press search button for searching
part 2: the search dropdown box, user will select options in here and select what they want and press search button
Problem is i dont know how to use simple search plugin to create dropdown box like image. And how to get data i want and show it in dropdown box from md file to this
image|690x97

last edited 06/25/21 by bibi

5 years ago

my code

TWIG

<div class="search-wrapper">
  <div class="container">
    <div class="form-row">
      <form name="search" data-simplesearch-form autocomplete="on" class="form-search-jobs">
        <div class=" form group col-sm-12">
          <div class="  form-inline">
            <i class="fa fa-search"></i>
            <div class="form-group">
            <input 
            placeholder="Search jobs..." 
            name="searchfield" class="search-input" 
            type="text" {% if min_chars > 0 %}
             min="{{- min_chars -}}" {% endif %} 
             required value="{{ query|e }}" data-search-invalid="{{ "PLUGIN_SIMPLESEARCH.SEARCH_FIELD_MINIMUM_CHARACTERS"|t(min_chars)|raw }}"
              data-search-separator="{{ config.system.param_sep }}"
               data-search-input="{{ base_url }}{{ config.plugins.simplesearch.route == '@self' ? '' : (config.plugins.simplesearch.route == '/' ? '' : config.plugins.simplesearch.route) }}/query"/>
            </div>
          </div>
        </div>
         <div class="form group col-sm-12">

          <select class="form-control location-dropdown" id="collection"  type="text">
            <options>1</options>
          </select>
          =
        </div> 
        <div class="form group   col-sm-12">
          {% if config.plugins.simplesearch.display_button %}
            <button class="search-button" type="submit">FIND JOB</button>
          {% endif %}
        </div>
      </form>
    </div>
  </div>
</div>

last edited 06/25/21 by pamtbaau

Topic	Replies	Views	Activity
Well done Grav Team General · by Jerry Hunt, 4 days ago	2	125	19 hours ago
Grav 2, Admin Next, API and Migrate are now in production! General · by pamtbaau, 24 hours ago	1	89	23 hours ago
Welcome to the new Grav Forums! General · by Andy Miller, 1 day ago	0	73	1 day ago
How active is Grav? General · by Marcel, 12 months ago	6	382	5 days ago
Contents in bin folder delete itself during core updates General · by Duc , 6 days ago	3	69	6 days ago

Suggested topics