Make Filter conditional?

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343038

-- HikaShop version -- : 4.4.3

Dear Hika team,

I have a page with two filters. One is all the sample products (Category) and the other one is de Fragrance Brand.
Since the fragrance brand is a very long list I would like to only show the Fragrance Brand filter when a customer chooses Fragrance in the first Category filter.

Is this possible and if yes can you please guide me in the right direction how to achieve this?

Thanks in advance.

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 4486
  • Thank you received: 609
  • MODERATOR
1 year 8 months ago #343039

Hello,

By default there are no options to do that, now if you provide an Url link to allow us to consider the relative context maybe we can find a trick in order to get close to your needs, maybe.
Awaiting your elements to go more far on your subject.

Note : Your provided Url link (from the message form) didn't allow us to reach your website, and see the context.
Regards

Last edit: 1 year 8 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343050

Your provided Url link (from the message form) didn't allow us to reach your website, and see the context.
Regards


Hi Philip,
That's strange since I copied and pasted the link from the address bar.
This is the Dutch version:
This message contains confidential information

and this is the translated one:
This message contains confidential information


Maybe you can reach it at the main page?
This message contains confidential information

In Dutch it's the Testers menu-item and in English it's Samples

Thanks in advance.

NB. May I ask why you couldn't reach the page? Did you get an error message?

Please Log in or Create an account to join the conversation.

  • Posts: 81361
  • Thank you received: 13037
  • MODERATOR
1 year 8 months ago #343056

Hi,

The page is working fine for me.

There is no mechanism to display a filter only when another filter is selected.
But it's possible by adding a bit of javascript code to the page for example in the view product / filter with some code like that:

<script>
function checkCheckboxes() {
var secondFilter = document.getElementById('hikashop_filter_main_div_module_266');
var checkboxes = document.querySelector('[data-container-div="hikashop_filter_form_module_265"]');
   var selected = false;
   for(var j=0; j < checkboxes.length; j++) {
     if(checkboxes[j].checked) selected = true;
   }
   if(selected) {
    secondFilter.style.display = 'block';
   }else {
    secondFilter.style.display = 'none';
   }
}
function addListeners() {
var checkboxes = document.querySelector('[data-container-div="hikashop_filter_form_module_265"]');
for(var i=0; i < checkboxes.length; i++) {
 checkboxes[i].addEventListener('click', checkCheckboxes);
}
}
addListeners();
checkCheckboxes();
</script>
Note that I didn't test that code so there might be some errors but it's a good starter.

The following user(s) said Thank You: HSD

Please Log in or Create an account to join the conversation.

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343071

Thank you very much Nicolas.
I will try first thing in the morning and I will let you know if it worked.

Please Log in or Create an account to join the conversation.

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343086

It works like a charm!
Thank you, thank you, thank you!

The following user(s) said Thank You: nicolas

Please Log in or Create an account to join the conversation.

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343270

Hi NIcolas
I'm sorry to bump this topic but it doesn't work correctly after all.
Because I only tried when I clicked Fragrances en that the Brands appear and that's fine.

But I just saw that the brands also appear when I click on one of the other categories.
The second filter must only be shown when customers click Fragrances in de first Category filter.

Please Log in or Create an account to join the conversation.

  • Posts: 81361
  • Thank you received: 13037
  • MODERATOR
1 year 8 months ago #343273

Hi,

I had indeed not understand that it should display only for one choice of the first filter. I thought it was any selection of the first filter.

Here is a modified version of the code so that it does it only for the "Fragrance" value:

<script>
function checkCheckboxes() {
var secondFilter = document.getElementById('hikashop_filter_main_div_module_266');
var checkboxes = document.querySelector('[data-container-div="hikashop_filter_form_module_265"]');
   var selected = false;
   for(var j=0; j < checkboxes.length; j++) {
     if(checkboxes[j].checked && checkboxes[j].value=='725') selected = true;
   }
   if(selected) {
    secondFilter.style.display = 'block';
   }else {
    secondFilter.style.display = 'none';
   }
}
function addListeners() {
var checkboxes = document.querySelector('[data-container-div="hikashop_filter_form_module_265"]');
for(var i=0; i < checkboxes.length; i++) {
 checkboxes[i].addEventListener('click', checkCheckboxes);
}
}
addListeners();
checkCheckboxes();
</script>

The following user(s) said Thank You: HSD

Please Log in or Create an account to join the conversation.

  • Posts: 59
  • Thank you received: 9
1 year 8 months ago #343393

Perfect! Thank you!

The following user(s) said Thank You: Philip

Please Log in or Create an account to join the conversation.

Time to create page: 0.068 seconds
Powered by Kunena Forum