OpenCart Community

Posted: **Mon Jun 24, 2013 10:19 pm**

Hi

Does anyone know how to make the product filters in 1.5.5.1 change to a dropdown instead of a checkbox option, I've got a lot of filters and this would a lot better looking.

Thanks

Posted: **Tue Jun 25, 2013 12:03 am**

Hi there,

Here is how to do it!

Step 1:
Open catalog/view/theme/your_template/template/module/filter.tpl

Step 2:
Replace this section of code:

Code: Select all

        <ul>
          <?php foreach ($filter_group['filter'] as $filter) { ?>
          <?php if (in_array($filter['filter_id'], $filter_category)) { ?>
          <li>
            <input type="checkbox" value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>" checked="checked" />
            <label for="filter<?php echo $filter['filter_id']; ?>"><?php echo $filter['name']; ?></label>
          </li>
          <?php } else { ?>
          <li>
            <input type="checkbox" value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>" />
            <label for="filter<?php echo $filter['filter_id']; ?>"><?php echo $filter['name']; ?></label>
          </li>
          <?php } ?>
          <?php } ?>
        </ul>

with:

Code: Select all

        <select>
			<option></option>
          <?php foreach ($filter_group['filter'] as $filter) { ?>
          <?php if (in_array($filter['filter_id'], $filter_category)) { ?>
          <option value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>" selected>
			<?php echo $filter['name']; ?>
          </option>
          <?php } else { ?>
          <option value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>">
			<?php echo $filter['name']; ?>
          </option>
          <?php } ?>
          <?php } ?>
        </select>

Step 3:
Replace this code:

Code: Select all

$('.box-filter input[type=\'checkbox\']:checked').each(function(element) {

with:

Code: Select all

$('.box-filter select option:selected').each(function(element) {

Finally:
Add this code to your stylesheet:
.box-filter select {
width: 100%
[/CODE]

Let me know how you get on

Peter

ralphstirrat wrote:Hi

Does anyone know how to make the product filters in 1.5.5.1 change to a dropdown instead of a checkbox option, I've got a lot of filters and this would a lot better looking.

Thanks

Posted: **Wed Jun 26, 2013 9:43 pm**

Wow Peter!

That worked excellent !! Thank you very much :-)

Ralph

Posted: **Wed Jun 26, 2013 10:08 pm**

No problem,

I see your also in Scotland, I'm in Glasgow! If you ever need some assistance just let me know

Peter

ralphstirrat wrote:Wow Peter!

That worked excellent !! Thank you very much :-)

Ralph

Posted: **Sat Jun 29, 2013 5:49 am**

hello. it works well except this:
when an user does not select any filter and clicks on "Filter" button the site returns the following error:

Code: Select all

Notice: Error: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1
Error No: 1064
SELECT COUNT(DISTINCT p.product_id) AS total FROM oc_product_to_category p2c LEFT JOIN oc_product_filter pf ON (p2c.product_id = pf.product_id) LEFT JOIN oc_product p ON (pf.product_id = p.product_id) LEFT JOIN oc_product_description pd ON (p.product_id = pd.product_id) LEFT JOIN oc_product_to_store p2s ON (p.product_id = p2s.product_id) WHERE pd.language_id = '2' AND p.status = '1' AND p.date_available <= NOW() AND p2s.store_id = '0' AND p2c.category_id = '130' AND p.product_id IN (SELECT a.product_id FROM oc_product_filter a in /home/x18tinon/public_html/system/database/mysql.php on line 50

what could be wrong?

thank you

Posted: **Sat Jun 29, 2013 7:42 pm**

Does it work okay before making these changes?

Peter

Posted: **Sun Jun 30, 2013 1:15 am**

yes, with the checkboxes it works okay.

Posted: **Sun Sep 01, 2013 1:48 am**

Very good! But I want to see the link in the Filters drop-dow administrator create the filters more easily and quickly.
I do not know why this version 1.5.5.1 the "Filters" in the top menu does not appear, as in the previous. Something very simple and very easy. Different in this new version without recourse. even in the demo site opencar not have the menu filters, moreover, there is also a module. With filters positioned in the drop-down menu, it is much simpler and easier to work.

Posted: **Mon Sep 02, 2013 8:39 pm**

Filters are included in 1.5.5.1? The demo.opencart.com site is still using 1.5.4.1.

Peter

manoetalk wrote:Very good! But I want to see the link in the Filters drop-dow administrator create the filters more easily and quickly.
I do not know why this version 1.5.5.1 the "Filters" in the top menu does not appear, as in the previous. Something very simple and very easy. Different in this new version without recourse. even in the demo site opencar not have the menu filters, moreover, there is also a module. With filters positioned in the drop-down menu, it is much simpler and easier to work.

Posted: **Tue Nov 14, 2017 6:15 pm**

Hiii pedro1993,
I had tried you code for Product Filters as Drop down, it's working good but when I tried to search selected item. It doesn't filter it. Can you help me out this? Version :2.3.0.2 VQMod

Here is my code :

Code: Select all


   <select style="width: 78%;height: 29px; margin-right: 0px; margin-left:-22px;">
			<option><?php echo $filter_group['name']; ?></option>
          <?php foreach ($filter_group['filter'] as $filter) { ?>
          <?php if (in_array($filter['filter_id'], $filter_category)) { ?>
          <option value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>" selected>
			<?php echo $filter['name']; ?>
          </option>
          <?php } else { ?>
          <option value="<?php echo $filter['filter_id']; ?>" id="filter<?php echo $filter['filter_id']; ?>">
			<?php echo $filter['name']; ?>
          </option>
          <?php } ?>
          <?php } ?>
        </select> 
      <button type="button" id="button-filter" class="btn btn-primary" style="margin-left: 0px;"><?php echo $button_filter; ?></button>
     $('.box-filter select option:selected').each(function(element) {

Posted: **Tue Feb 12, 2019 12:59 am**

Has anyone had any success changing the product filters to a dropdown instead of checkbox for Opencart 3? The filter.twig code is different than the example above and the suggested code to replace doesn't seem to work. Thanks.

filter.twig code:

<div class="panel panel-default">
<div class="panel-heading">{{ heading_title }}</div>
<div class="list-group"> {% for filter_group in filter_groups %} <a class="list-group-item">{{ filter_group.name }}</a>
<div class="list-group-item">
<div id="filter-group{{ filter_group.filter_group_id }}">{% for filter in filter_group.filter %}
<div class="checkbox">
<label>{% if filter.filter_id in filter_category %}
<input type="checkbox" name="filter[]" value="{{ filter.filter_id }}" checked="checked" />
{{ filter.name }}
{% else %}
<input type="checkbox" name="filter[]" value="{{ filter.filter_id }}" />
{{ filter.name }}
{% endif %}</label>
</div>
{% endfor %}</div>
</div>
{% endfor %}</div>
<div class="panel-footer text-right">
<button type="button" id="button-filter" class="btn btn-primary">{{ button_filter }}</button>
</div>
</div>
<script type="text/javascript"></script>

OpenCart Community

Product filters as downdown instead of checkbox

Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox

Re: Product filters as downdown instead of checkbox