Форматирование wNumb останавливает работу ползунка noUiSlider - PullRequest
Новая
       13

Форматирование wNumb останавливает работу ползунка noUiSlider

0 голосов
/ 03 мая 2018

У меня есть слайдер цен на моем сайте, и диапазон цен отображается в диапазоне от 0,0 до 5 000 000,0 фунтов стерлингов с конечным нулем.

Я изменил код числового формата с: 

    format: wNumb({
            decimals: 1
        })

до: 

    format: wNumb({
            decimals: 0,
            thousand: ','
        })

Теперь эта цена отображается как £ 0 - £ 5 000 000, что я и хочу.

Проблема теперь в том, что при поиске цена в URL отображает кодировку ascii для запятой% 2C, а результаты поиска не фильтруются 

    adv_filter_price_min=0&adv_filter_price_max=5%2C000%2C000

Как получить, чтобы кодировка ascii не использовалась в URL? например: 

    adv_filter_price_min=0&adv_filter_price_max=5000000

Большое спасибо

S

Полный код 

var rangeslider = jQuery('.rangeslider');
var rangecontainer = rangeslider.parent('.rangeslidercontainer');
var txtlowprice = rangecontainer.children('.adv_filter_price_min');
var txthiprice = rangecontainer.children('.adv_filter_price_max');
var spnlowprice = rangecontainer.find('.text_price_min');
var spnhiprice = rangecontainer.find('.text_price_max');
var defminprice = Number(interfeis_var.search_minprice);
var defmaxprice = Number(interfeis_var.search_maxprice);
var hdnminprice = txtlowprice;
var hdnmaxprice = txthiprice;
var minprice = Number(hdnminprice.val());
var maxprice = Number(hdnmaxprice.val());

if(rangeslider.length){
    rangeslider.noUiSlider({
        start: [ minprice, maxprice ],
        step: 10000,
        range: {
            'min': defminprice,
            'max': defmaxprice
        },
        connect: true,
        // Set some default formatting options.
        // These options will be applied to any Link
        // that doesn't overwrite these values.
        format: wNumb({
            decimals: 0
        })
    });

    rangeslider.Link('lower').to(txtlowprice);
    rangeslider.Link('upper').to(txthiprice);
    rangeslider.Link('lower').to(spnlowprice, setFormat);
    rangeslider.Link('upper').to(spnhiprice, setFormat);

    }

1 Ответ

0 голосов
/ 15 июня 2018

Вы используете wNumb для форматирования ввода, переданного в слайдер, поэтому, когда вы пытаетесь извлечь данные из слайдера, он возвращает вам отформатированные входные данные.

В вашем случае, когда вы отформатировали его с помощью thousand: ',', получилось число от 50000 до 50000 (обратите внимание на запятую). Поэтому, когда вы пытаетесь получить его обратно из слайдера, он возвращает вам 50 000 вместо 50000.

Поэтому я предлагаю вам выполнить следующие действия, чтобы отформатировать числа обратно.

Создать объект wnumb, чтобы передать его слайдеру 

var thousand_format = wNumb({
            decimals: 0,
            thousand: ','
});

Когда вы возвращаете данные из ползунка после использования ползунка, отформатируйте его, используя объект тысяч_форматов, используя метод wnumb's.

var unformat_input = thousand_format.from( '50,000' ); // it will return 50000

То же unformat_input, которое вы используете для установки в URL. wNumb приводит к тому, что слайдер не работает должным образом, так как wNumb требует чисел (50000), и после вашего первого использования вы должны передать ему строку (50 000).

Узнайте больше о wNumb здесь

...