Display low search results under category headings

Question

I hope you're all well.

I have built a new website in EE and I'm using Low Search for a filtering system. It is set up as a series of checkboxes which allow the user to choose the categories they wish to view, and upon hitting search they're shown a page of results. This is all working perfectly fine, however I need to make an adjustment to the results page.

At present a user can filter any categories, for example;

• Category 1
  • Category 1 child 1
  • Category 1 child 2
  • Cateogry 1 child 3

If the user ticks Category 1 it will select all the child items so the results page contains all the entris from these four categories (including the parent). Is it possible to display these on the results page as so (assuming the user has chose to display all categories):

Category 1: Result 1, Result 2, Result 3

Category 1 child 1: Result 4, Result 5

Category 1 child 2: Result 6

So essentially all the results are displayed under their category headings. The only caveat to this would be that the headings only show if there are results.

I managed to do this in a round about by putting an embed on the results page which fed each category id into the results tag, the problem here was that it just displayed every entry rather than what was searched for (see code):

{exp:channel:categories channel="products"}
  {embed="products/results-list" category="{category_id}"}
{/exp}   

//Results tag in the embed template.   
{exp:low_search:results collection="products" limit="999" query="{segment_3}" status="Open|Featured" category="{embed:category}"}

That didn't work so I stripped that out and I currently have the results tag code above (minus the category declaration). My search form looks like this:

{exp:low_search:form query="{segment_3}" collection="products" result_page="products/results" form_id="filter"}

  //Followed by a series of these
  <div>
    <a class="button filter_toggle" href="#">Sound</a>
    <fieldset>
      {exp:channel:categories channel="products" category_group="1" show="1|15|16|17|18|19|20|21|22" show_empty="no" id="nav_categories_sound"}
        <label class="inline" for="{category_url_title}"><input type="checkbox" name="category[]" {if category_url_title == "sound"}class="first-check"{/if} id="{category_url_title}" value="{category_id}" {if '{category_id}' IN ({low_search_category:sound})}checked="checked"{/if}> {category_name}</label>
      {/exp:channel:categories}
    <fieldset>
  </div>

  //And then
  <div>
    <input type="submit" class="button" value="Show results">
  </div>

{/exp:low_search:form}

Any help would be greatly appreciated, Thank you.

Answer 1

I managed to come to a conclusion in the end.

I did the search query and got all the categories from those entries. I fed the category IDs into a PHP array, removed all the duplicates, then did a set of embeds using the collected IDs. Posting here if anyone is interested.

<div class="col-sm-12">
  {exp:low_search:results collection="products" limit="999" query="{segment_3}" status="Open|Featured"}
    {exp:gwcode_categories depth="2" entry_id="{entry_id}" show_empty="no" style="linear"}
      <?php $categories[] = '{cat_id}'; //Store all child categories into array ?> 
    {/exp:gwcode_categories}
  {if no_results}
  <div class="search_error">
    <p>
      Sorry, your query did not return any results.
      Please try again.
    </p>
  </div>
  {/if}
  {/exp:low_search:results}
    <?php
    $categories = array_unique($categories); //Remove all duplicate entries
    foreach ($categories as $category) { //Loop through all array items and create embed template for each
      echo '{embed="products/results-list" category="'.$category.'"}';
    }?>
</div>

Then just create a normal entries list using the category embed from the PHP array.

{exp:channel:entries channel="products" category="{embed:category}" status="Open|Featured"}
  ...
{/exp:channel:entries}

This works for me but might not for anyone else.