Jump to content

Faceted search - Price slider not a slider

apicedda
 Share

Recommended Posts

apicedda Newbie

apicedda

Posted
Posted

Hello again, i couldn't find a solution other than buying a module. I'm using the faceted price slider but here is what it looks like: http://imgur.com/mGcABB2.png

Not only it's not a slider but it's a big list of ranges which are not needed at all and also the price range does not include taxes as i set up in the module settings. 

 

P.S. i still have issues with this site not showing properly, am i the only one?

Link to comment
Share on other sites
apicedda Newbie

apicedda

Posted
  • Author
Posted

sure

 

Prestashop 1.7.2

example page: https://colosishop.com/it/12-orologi

 

configurazion 1: http://imgur.com/JKLxgVM

configuration 2: http://imgur.com/2pGvONk

 

so the name of the filter is "filter by product price (slider)" but on the right it says "list of ranges" and i can't change it to a slider.

 

on the example page you can try to check the "10-42€" range and you will see some items that costs 44,90 are shown too.

 

Let me know if you need any more info

Link to comment
Share on other sites
rictools Mentor

rictools

Posted
Posted

Is "peso del prodotto" the weight?

 

Seems like you use a module to show a second finer price filter after choosing the first. Or is it a new function in Prestashop 1.7?

 

The tax problem is the same in my older Prestashop, it's discussed here:

 

https://www.prestashop.com/forums/topic/544108-layered-navigation-blockproduct-price-filter-working-with-price-with-tax/

Link to comment
Share on other sites
apicedda Newbie

apicedda

Posted
  • Author
Posted

"peso del prodotto" means product weight

 

Faceted search should be the only module i'm using for filtering, not sure if there is any difference with 1.6

 

For the tax thing that post looks like it's related to 1.6 but i'll try to see if that line of code is the same

Link to comment
Share on other sites
  • 4 weeks later...
JoeSchiaffi Explorer

JoeSchiaffi

Posted
Posted

Hi guys, I'm using Presta 1.7.2 (in this version, lot of bugs I've found in 1.7.1 where solved) from lot of searches I've done I've found out that Faceted search in Presta 1.7 has a common problem, found out by lot of users (there are a different discussion thread unsolved about this): the filter by Price that only show ranges with radio buttons, make ranges that doesn't make sense.

For escample, I've prices of: 6,99 € 9,99 € 14,99 € 19,99 € 24,99 € 29,99 € and so on and my ranges are: 14-15 € 19-20€ 24-25€ and so on, so as result I've lot of unuseful ranges, they should by for escample 10-20 , 20-30 and so.

 

The problem was there in Presta 1.7.1 and with 1.7.2 has not been solved, it's an issue of the Faceted Search module (so it's not necessary to update all Presta, but only this module) , it's an algorithm problem I think.

 

So I don't think that we can solve this just by changing some code rows, but something has to be totally rewritten. 

 

We should ask the Prestashop Team to develop a new updated version of this module, how can we do that?

  • Like 4
Link to comment
Share on other sites
  • 4 months later...
  • 4 weeks later...
  • 3 weeks later...
  • 2 weeks later...
  • 1 month later...
  • 8 months later...
  • 2 months later...
  • 2 weeks later...
Radkosky Newbie

Radkosky

Posted
Posted

this price slider above definitely does not work (my currency is other than euro) how to uninstall it? There is no new module to uninstall and after deleting modules/tc_pricefilter folder the "module" is still active.

Link to comment
Share on other sites
sidney712 Newbie

sidney712

Posted
Posted (edited)

jQuery UI slider for price filter. It's my temporary solution. I use it with my theme based on Classic.
In this file
  sitename/themes/classic/templates/catalog/_partials/facets.tpl

after the string

  {if $facet.widgetType !== 'dropdown'}

insert this 

{if $facet.type == 'price'}
  <div class="slider-range-wrapper">
    <p>
      <input type="text" id="amount" readonly>
      <a id="submitprice">
        <button class="btn btn-secondary">OK</button>
      </a>
    </p>
    <div id="slider-range" data-type="{$facet.type}" data-quantity="{$filter.magnitude}" data-min-value="{$facet.properties.min}" data-max-value="{$facet.properties.max}"></div>
  </div>
{/if}

and at the end of the file add this script 

  <script type="text/javascript">
    $('#search_filters').ready(function() {
      var langShop = prestashop.language.iso_code;
      var langPrice = $('.slider-range-wrapper').parent().children('.facet-title')[0].innerHTML;
      var pageURLIndex = -1;
      var sliderPrice = function() {
        var minValue = $('#slider-range').data('min-value');
        var maxValue = $('#slider-range').data('max-value');
        $('#slider-range').slider({
          range: true,
          min: minValue,
          max: maxValue,
          values: [minValue, maxValue],
          slide: function(event, ui) {
            $('#amount').val(ui.values[0] + ' ' + prestashop.currency.sign + ' - ' + ui.values[1] + ' ' + prestashop.currency.sign);
          },
          stop: function(event, ui) {
            pageURLIndex = window.location.href.indexOf("?");
            $('#amount').val(ui.values[0] + ' ' + prestashop.currency.sign + ' - ' + ui.values[1] + ' ' + prestashop.currency.sign);
            $('#submitprice').attr("href", window.location.href + ((pageURLIndex === -1) ? '?q=' : '/') + langPrice + '-' + prestashop.currency.sign + '-' + $('#slider-range').slider('values', 0) + '-' + $('#slider-range').slider('values', 1));
          }
        });
        $('#amount').val($('#slider-range').slider('values', 0) + ' ' + prestashop.currency.sign + ' - ' + $(' #slider-range').slider('values', 1) + ' ' + prestashop.currency.sign);
      };
      sliderPrice();
    });
  </script>

 

Edited by sidney712 (see edit history)
Link to comment
Share on other sites
datshay Newbie

datshay

Posted
Posted
On 5/10/2019 at 7:30 PM, sidney712 said:

jQuery UI slider for price filter. It's my temporary solution. I use it with my theme based on Classic.
In this file
  sitename/themes/classic/templates/catalog/_partials/facets.tpl

after the string

  {if $facet.widgetType !== 'dropdown'}

insert this 


{if $facet.type == 'price'}
  <div class="slider-range-wrapper">
    <p>
      <input type="text" id="amount" readonly>
      <a id="submitprice">
        <button class="btn btn-secondary">OK</button>
      </a>
    </p>
    <div id="slider-range" data-type="{$facet.type}" data-quantity="{$filter.magnitude}" data-min-value="{$facet.properties.min}" data-max-value="{$facet.properties.max}"></div>
  </div>
{/if}

and at the end of the file add this script 


  <script type="text/javascript">
    $('#search_filters').ready(function() {
      var langShop = prestashop.language.iso_code;
      switch (langShop) {
        case 'fr':
          langPrice = 'Prix';
          break;
        case 'ru':
          langPrice = 'Цена';
          break;
        case 'uk':
          langPrice = 'Ціна';
          break;
        default:
          langPrice = 'Price';
      }
      var pageURLIndex = -1;
      var sliderPrice = function() {
        var minValue = $('#slider-range').data('min-value');
        var maxValue = $('#slider-range').data('max-value');
        $('#slider-range').slider({
          range: true,
          min: minValue,
          max: maxValue,
          values: [minValue, maxValue],
          slide: function(event, ui) {
            $('#amount').val(ui.values[0] + ' ' + prestashop.currency.sign + ' - ' + ui.values[1] + ' ' + prestashop.currency.sign);
          },
          stop: function(event, ui) {
            pageURLIndex = window.location.href.indexOf("?");
            $('#amount').val(ui.values[0] + ' ' + prestashop.currency.sign + ' - ' + ui.values[1] + ' ' + prestashop.currency.sign);
            $('#submitprice').attr("href", window.location.href + ((pageURLIndex === -1) ? '?q=' : '/') + langPrice + '-' + prestashop.currency.sign + '-' + $('#slider-range').slider('values', 0) + '-' + $('#slider-range').slider('values', 1));
          }
        });
        $('#amount').val($('#slider-range').slider('values', 0) + ' ' + prestashop.currency.sign + ' - ' + $(' #slider-range').slider('values', 1) + ' ' + prestashop.currency.sign);
      };
      sliderPrice();
    });
  </script>

 

I tried the code above, but it shows only OK button and a input field. No slider. Is it the full code?

Link to comment
Share on other sites
  • 2 weeks later...
  • 2 weeks later...
  • 3 months later...
razorsharpshady Newbie

razorsharpshady

Posted
Posted (edited)

I see where the error is. 

In the themes/classic/templates/_partials/javascript.tpl file the jquery is loaded in last few files. I just shifted it to up before all the js files are included in the same file and the price filter worked. 

The error that I was getting in the console was $(...).slider is not a function 

slider is a function of jquery ui , it must be loaded only after jquery, whereas in the default javascript.tpl file it was the opposite.

 

jquery.PNG

filer.PNG

Edited by razorsharpshady (see edit history)
Link to comment
Share on other sites
  • 1 year later...
jdernt Newbie

jdernt

Posted
Posted (edited)
On 2/22/2019 at 10:23 AM, ehtsham said:

same problem, V 1.7 price slider not working .. show radio buttons

https://motorcycleshop.pk/17-motorcyle-helmets

 

 

On 8/22/2017 at 3:22 AM, apicedda said:

sure

 

Prestashop 1.7.2

example page: https://colosishop.com/it/12-orologi

 

configurazion 1: http://imgur.com/JKLxgVM

configuration 2: http://imgur.com/2pGvONk

 

so the name of the filter is "filter by product price (slider)" but on the right it says "list of ranges" and i can't change it to a slider.

 

on the example page you can try to check the "10-42€" range and you will see some items that costs 44,90 are shown too.

 

Let me know if you need any more info

How did you solve this issue? i see a working sliders on your pages, so can you advise anything?

Edited by jdernt (see edit history)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...