Как сбросить куку у ползунка?

Question

[Genri_Rus]

Вот пример: https://codepen.io/Genri_Rus/pen/xxGPjbL

Сохранение и обновление куки происходит, но при клике по кнопке сбросить - в консоли ошибка



Как можно сделать сброс при клике ?

Comments

[Sergey]

Нужен ваш код, а не пример

[Genri_Rus]

Sergey, это мой код: https://codepen.io/Genri_Rus/pen/xxGPjbL

[Шохрух Шаймардонов]

Genri_Rus, вам надо продумать код. Ибо вы все впихали в 1 функцию (которая, между прочем, также и создает ползунок) и вызываете ее при ресете.
Как исправить: логику/события разбить на отдельные методы/функции.
Если это функции, то пусть в качестве 1 из аргументов принимают уже созданный ползунок и работают с ним

[Genri_Rus]

Шохрух Шаймардонов, он вообще не срабатывает

Я пытался отдельно обернуть в функцию,

function showFilters() {
	$(".range-price").each(function() {
			
		var rangeSlider = $(this)[0];
		var rangeSliderMin = $(this).parent().find(".min-price")[0];
		var rangeSliderMax = $(this).parent().find(".max-price")[0];
		var rangeIn = [rangeSliderMin, rangeSliderMax];

		noUiSlider.create(rangeSlider, {
			animate: true,
			animationDuration: 300,
			start: [sliderMinPrice, sliderMaxPrice],
			connect: true,
			range: {
				'min': 0,
				'max': 40000
			},
			format: wNumb({
				decimals: 0,
				thousand: ""
			})
		});
	});
}

[Шохрух Шаймардонов]

Genri_Rus, я вам уже выше сказал, что ваш код не годится. Подумайте его заново. Перепишите. Иногда начинать с чистого листа решает проблему в разы быстрее и далее улучшает качество продукта по сравнению с текущим его состоянием. Постоянно практикую.

Метод проб и ошибок

[Genri_Rus]

Шохрух Шаймардонов, этот код работает отлично

Дело в другом, инициализация не происходит, вообще непонятно почему

[Шохрух Шаймардонов]

Genri_Rus,

вообще непонятно почему

Так вы почитайте ошибку.
Там ж сказано, что слайдер УЖЕ ИНИЦИИРОВАН! Ищите где вы его уже создавали. И не пытайтесь его создавать снова

[Genri_Rus]

Шохрух Шаймардонов, я правильно понимаю, что это код инициализации ?

noUiSlider.create(rangeSlider, {
	animate: true,
	animationDuration: 300,
	start: [sliderMinPrice, sliderMaxPrice],
	connect: true,
	range: {
		'min': 0,
		'max': 40000
	},
	format: wNumb({
		decimals: 0,
		thousand: ""
	})
}););

Дело в том, что в start: [sliderMinPrice, sliderMaxPrice] - задаются диапазоны для слайдера в самой инициализации

[Genri_Rus]

Шохрух Шаймардонов, а вы вообще работали с плагином noUiSlider ?

Эта проблема наблюдается не только у меня, плагину требуется переинициализация, а как ее сделать не совсем понятно (

Пример

Answer 1

[Sergey]

Код инициализации выносите в отдельную функцию. Например createSlider, инициализируете его. И создаёте функцию для сброса значения слайдера на дефолтные после удаления куки

Comments

[Genri_Rus]

он вообще не срабатывает

Я пытался отдельно обернуть в функцию, правильно ?

function showFilters() {
  $(".range-price").each(function() {
      
    var rangeSlider = $(this)[0];
    var rangeSliderMin = $(this).parent().find(".min-price")[0];
    var rangeSliderMax = $(this).parent().find(".max-price")[0];
    var rangeIn = [rangeSliderMin, rangeSliderMax];

    noUiSlider.create(rangeSlider, {
      animate: true,
      animationDuration: 300,
      start: [sliderMinPrice, sliderMaxPrice],
      connect: true,
      range: {
        'min': 0,
        'max': 40000
      },
      format: wNumb({
        decimals: 0,
        thousand: ""
      })
    });
  });
}

[Genri_Rus]

Что я делаю не так ?

[Genri_Rus]

И создаёте функцию для сброса значения слайдера

Вы про это имели ввиду ?
slider.noUiSlider.reset();