1

I've a working Super Search form, need to filter a category search result page {site_url}/event/results/search&category=sport/

where sport is a parent category. working form is...

{!----------- SUPER SEARCH FORM -------------------------------------------}

<form method="post" action="{path='event/results'}" accept-charset="UTF-8" class="search-box" data-abide>
{exp:super_search:search channel="main_event" status="open|featured"}
{if super_search_category}<input type="hidden" name="category" value="{super_search_category}" />{/if}

<div class="row">
<div class="large-6 columns">
<label for="sort">Location:</label>
<small class="error">Please Choose Event</small>
<select name="category[]" id="event" data-placeholder="All Events" style="width:100%" required>
<option></option>
{exp:channel:categories category_group="1" show_empty="no" parent_only="yes" style="linear"}
<option value="{category_url_title}">{category_name}</option>
{/exp:channel:categories}
</select>
</div>
{/exp:super_search:search}
</form>

{!----------- /SUPER SEARCH FORM -------------------------------------------}

The parent category sport have some child categories, i need to dynamically filter the results page via a select drop-down the child categories of the searched parent category.

With GWcode Categories plugin, was able to come up with this

<select name="category" onchange="if(this.options[this.selectedIndex].value != ''){window.top.location.href=this.options[this.selectedIndex].value}" id="multi" data-placeholder="Select" style="width:100%" />
<option></option>
{exp:gwcode_categories channel="main_event" group_id="1" excl_group_id="3|4" show_empty="no" cat_id="{segment_3_category_id}" depth="2" style="linear"}
<option value="{site_url}event/results/search&category={super_search_category}&&{cat_url_title}" {if super_search_category_{cat_url_title}}selected="selected"{/if}>{cat_name}</option>
{/exp:gwcode_categories}
</select>

I think i'm very close but the GWcode tags code isn't perfect and stable because after a first successful filtering.. {site_url}event/results/search&category=sport&&soccer

trying to filter again, i got this {site_url}event/results/search&category=sport&&soccer&&tennis

instead of

{site_url}event/results/search&category=sport&&tennis

Thanks

  • Are you using any AJAX to submit the form or display the child categories (after selecting a parent category)? – Solspace Nov 15 '13 at 23:11
  • No, just a manual search. – lincolnpixel Nov 16 '13 at 0:28
1

The problem with your second block of code is that the option values for the category select field is a URL, when it should be category data, such as a category_id, category_url_title or category_name.

Let's say your first search with the first dropdown sends you to http://mysite.com/event/results/search&category=sports

On this result page, you can create another search form, and pass the previous search's values. In this case, you could pass "sports" in a hidden field, for example:

{if super_search_category != ""}
<input type="hidden" name="category[]" value="{super_search_category}&&" />
{/if}

Please note the brackets in category[]. This is needed to be able to submit an array of category data. If you forget this, you are sending a single string of data, i.e. only the last filled field with name="category". The && is to enable an AND search with other categories. (The alternative is to use inclusive_categories="yes" in {exp:super_search:results})

In addition to the above in your search form on your result page, just create a dropdown with your child categories. Use whatever you need for this, GWcode or other. The important is to

  • use name="category[]" here again
  • pass category data in the option's value="" attribute (not a URL). Add && at the end to specify that categories are to be searched inclusively.

In other words, try getting something like this:

<select name="category[]">
   <option value="soccer&&">Soccer</option>
   <option value="tennis&&">Tennis</option>
   ...
</select>

If you select "Tennis", for example, in this second search submission, you should be sent to http://mysite.com/event/results/search&category=sports&&tennis

No messy javascript to mess with either! :)

| improve this answer | |
  • Hi, made the suggested modifications on the results page. The second search submission link is being directed to mysite.com/event/results/search&category=sports/tennis, the && is missing. – lincolnpixel Nov 19 '13 at 19:04
  • Any way you can show your code after the first submission? Make sure the hidden field is before the select field. – Solspace Nov 22 '13 at 0:21
  • Sure, but i can't because the code is too long.. due to StackExchange comment field characters limitation. – lincolnpixel Nov 22 '13 at 1:15
  • I updated my answer above. There was a missing && for the select field category[] field – Solspace Nov 27 '13 at 1:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.