How Do I See What Filters Are Being Applied?
Hi,
I am using Low Search to generate a list of entries that can be filtered, and re-ordered, etc. I am getting the results I would expect just fine. The only problem I am having is I can't figure out how to get an indicator onto my filter controls showing what filters are being applied. I see an example in the docs relating to categories, but I haven't been able to translate it over to my controls.
Here's and example of my code:
<button class="btn btn-red dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
FILTER BY CLIENT
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
{exp:low_search:filters query="{segment_3}" result_page="/login/announcements/%s"}
<li>
<a href="{low_search:url child:announcement_related_customers=''}">All Customers Assigned to Rep</a>
</li>
{exp:zoo_visitor:details}
{visitor:rep_customers}
<li>
<a href="{low_search:url child:announcement_related_customers='{visitor:rep_customers:entry_id}'}">{visitor:rep_customers:title}</a>
</li>
{/visitor:rep_customers}
{/exp:zoo_visitor:details}
{/exp:low_search:filters}
</ul>
</div>
<div class="order-by btn-group">
<div type="button" class="btn btn-default">Order By</div>
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="caret"></span>
<span class="sr-only">Order By</span>
</button>
<ul class="dropdown-menu">
{exp:low_search:filters query="{segment_3}" result_page="/login/announcements/%s"}
<li><a href="{low_search:url orderby='title' sort='asc'}">Title A-Z</a></li>
<li><a href="{low_search:url orderby='title' sort='desc'}">Title - Z-A</a></li>
<li><a href="{low_search:url orderby='entry_date' sort='desc'}">Date - Newest to Oldest</a></li>
<li><a href="{low_search:url orderby='entry_date' sort='asc'}">Date - Oldest to Newest</a></li>
{/exp:low_search:filters}
</ul>
</div>
<div class="per-page btn-group">
<button type="button" class="btn btn-default">Per Page</button>
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="caret"></span>
<span class="sr-only">Per Page</span>
</button>
<ul class="dropdown-menu">
{exp:low_search:filters query="{segment_3}" result_page="/login/announcements/%s"}
<li><a href="{low_search:url limit='5'}">5</a></li>
<li><a href="{low_search:url limit='10'}">10</a></li>
<li><a href="{low_search:url limit='15'}">15</a></li>
<li><a href="{low_search:url limit='20'}">20</a></li>
{/exp:low_search:filters}
</ul>
</div>
In this example I have three sets of filters. One to filter the results by the related client, one to control the order and sorting of results and one to control the number of results per page. All of the filters work fine, but I can't figure out how to mark the filter that is being applied to the results (for example if I change the results per page to 5 I'd like to mark the 5 filter link so the user can see that that is the filter being applied currently. Either with a call or adding a checkmark after the 5 or something like that).
Can you help me figure out how to do this?
Thanks,
Brian
Replies
Low 7 Dec 2016 14:59
Within the Filters tag (as well as the Form and the Results tag), all available parameter values are available as per these rules.
You're setting the parameters using the URL tag (short version) like so: {low_search:url some_param="some-value"}. Which means the actual value can be retrieved using {low_search_some_param}. You can use that variable in a conditional.
So, taking your example, something like this should work:
Note that you do not need three Filters tags here. You could do with just one, containing all options.
Brian Rivet 7 Dec 2016 16:03
Thanks Low! Works great!