Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Добрые люди помогите с ползунком jquery ui slider (https://javascript.ru/forum/misc/73225-dobrye-lyudi-pomogite-s-polzunkom-jquery-ui-slider.html)

SERblY 29.03.2018 23:34

Добрые люди помогите с ползунком jquery ui slider
 
Вложений: 1
Суть такова, сам как смог прикрутил, тоесть если его двигаешь в инпутах меняется все нормально, поиск по этим пораметрам срабатывает, но вот незадача, если обновить страничку то в инпутах диапазон остаетсся тот который выбирали, а ползунок на стандартные исходные возвращаеться, ребят помогите, как сделать чтобы он тоже оставался
Вот код самого ползунка (скрипта) мб что то лишнее или не так настроил, надеюсь поможете:
<script src="/assets/jquery-ui/jquery-ui.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){


/* слайдер цен */

jQuery("#slider").slider({
	min: 0,
	max: 1000000,
	step: 500,
	range: true,
	stop: function(event, ui) {
		jQuery("input.minCost").val(jQuery("#slider").slider("values",0));
		jQuery("input.maxCost").val(jQuery("#slider").slider("values",1));
		
    },
    slide: function(event, ui){
		jQuery("input.minCost").val(jQuery("#slider").slider("values",0));
		jQuery("input.maxCost").val(jQuery("#slider").slider("values",1));
    }
});

jQuery("input.minCost").change(function(){

	var value1=jQuery("input.minCost").val();
	var value2=jQuery("input.maxCost").val();

    if(parseInt(value1) > parseInt(value2)){
		value1 = value2;
		jQuery("input.minCost").val(value1);
	}
	jQuery("#slider").slider("values",0,value1);	
});

	
jQuery("input.maxCost").change(function(){
		
	var value1=jQuery("input.minCost").val();
	var value2=jQuery("input.maxCost").val();
	
	if (value2 > 1000000) { value2 = 1000000; jQuery("input.maxCost").val(1000000)}

	if(parseInt(value1) > parseInt(value2)){
		value2 = value1;
		jQuery("input.maxCost").val(value2);
	}
	jQuery("#slider").slider("values",1,value2);
});



// фильтрация ввода в поля
	jQuery('input.maxCost, input.minCost').keypress(function(event){
		var key, keyChar;
		if(!event) var event = window.event;
		
		if (event.keyCode) key = event.keyCode;
		else if(event.which) key = event.which;
	
		if(key==null || key==0 || key==8 || key==13 || key==9 || key==46 || key==37 || key==39 ) return true;
		keyChar=String.fromCharCode(key);
		
		if(!/\d/.test(keyChar))	return false;
	
	});


});



</script>


вот кусок формы где ползунок и инпуты:
<div class="col-md">
				<input style="padding-left:3px; padding-right:3px" class="price_field minCost form-control" name="{%$id%}[over]" type="number" step="500.00" id="" placeholder="Цена, {%$locale.888%}" value=""/>
				</div>
				<div class="col-md">
				<input style="padding-left:3px; padding-right:3px" class="price_field maxCost form-control" name="{%$id%}[less]" type="number" step="500.00" placeholder="Цена, {%$locale.889%}" id="bs_{%$field.id%}" value=""/>
			</div>

вот подгружаеться сам ползунок: прям ниже инпутов сразу (я просто разделил чтобы понятнее было)
<div class="sliderCont">
					<div id="slider"></div>
			</div>


Прикреплю еще скрин на всякий чтобы было яснее! Надеюсь на помощь! Спасибо!

Nexus 29.03.2018 23:40

Данные из инпутов передались на сервер для фильтрации данных, при отрисовке этих инпутов нельзя в них поместить переданные на сервер значения?

рони 29.03.2018 23:52

SERblY,
slider ui сохранение

SERblY 30.03.2018 13:16

так как лучше сделать я так и не понял, Вы извините конечно мб я туплю. просто не сильно шарю в скрипте, так поставить могу что то подправить но вот как сделать лучше чтобы не так на отмашку а чтобы рабочий вариант хороший был не допру никак :(

Nexus 30.03.2018 13:25

SERblY, правильнее будет вывести в input переданное фильтру значение и при инициализации слайдера воспользоваться ими.

Сохранять значения в localStorage по-моему глупо, когда есть возможность модифицировать backend.

рони 30.03.2018 13:41

SERblY,
проще способ Nexus,
на php в строку 12 например добавить values: <[??,??]>, не знаю php, может кто подскажет

SERblY 30.03.2018 15:13

Цитата:

Сообщение от Nexus (Сообщение 481874)
SERblY, правильнее будет вывести в input переданное фильтру значение и при инициализации слайдера воспользоваться ими.

Сохранять значения в localStorage по-моему глупо, когда есть возможность модифицировать backend.

ясно что нечего не ясно, все равно спасибо хоть на этом

SERblY 30.03.2018 15:13

Цитата:

Сообщение от рони (Сообщение 481875)
SERblY,
проще способ Nexus,
на php в строку 12 например добавить values: <[??,??]>, не знаю php, может кто подскажет

я тоже не силен не в том не в том, по этому и тут на форуме!

Nexus 30.03.2018 15:15

SERblY, какой шаблонизатор используется?
Каким методом данные на сервере передаются?

SERblY 30.03.2018 15:44

smarty
<div class="col-md">
				<input style="padding-left:3px; padding-right:3px" class="price_field minCost form-control" name="{%$id%}[over]" type="number" step="500.00" id="" placeholder="Цена, {%$locale.888%}" value=""/>
				</div>
				<div class="col-md">
				<input style="padding-left:3px; padding-right:3px" class="price_field maxCost form-control" name="{%$id%}[less]" type="number" step="500.00" placeholder="Цена, {%$locale.889%}" id="bs_{%$field.id%}" value=""/>
			</div>

повторюсь при изменение числового значения input ползунок работает. при передвижение ползунка меняется значение input . поиск по данным критериям срабатывает. но при открытие вновь поиска в input данные прошлого запроса сохраняются пока их не обнулишь или не изменишь а ползунок тупо встает на исходную (вот главная проблема), ну и как специалисты мб еще подскажите что то мб в коде лишнее или можно сделать лучше. безмерно благодарен лично Вам за помощь любую и форуму конечно, уже не 1 раз обращаюсь.


Часовой пояс GMT +3, время: 16:10.