Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Помогите подружить слайдер с input (https://javascript.ru/forum/dom-window/47392-pomogite-podruzhit-slajjder-s-input.html)

nSide 20.05.2015 01:43

уже не надо. распарсил ответ слайдера
спасибо )))

kostyanet 21.05.2015 21:36

Цитата:

Сообщение от kingstakh
что в инпутах значения value сохраняются такие же как при отправке формы.

Небось браузер их туда пихает посльку дефаульт валуе нету.

Кстати, почему пишут "диапазон цен", если смысл в точности обратный - сколько вы денег хотите потратить. Надо писать "Ваш бюджет".

nSide 23.05.2015 00:14

Во-первых, огромное спасибо всем в этой теме за неоценимую помощь. ))) Без вас я бы еще долго мучился.

Во-вторых, слайдер обновился и теперь "Для того чтобы использовать публичные методы, вначале нужно записать значение слайдера в переменную".
Поэтому, с вашей помощью, я использовал следующую конструкцию:

<input type="text" name="pricefrom" id="pricefrom" value="">
<input type="text" name="priceto" id="priceto" value="">

<input type="text" id="range" name="range" value="" />

<script type="text/javascript">
	(function($) {
		$(function(){
			var $range = $("#range");
			var track = function () {
				var value = this.value.split(";");
  				jQuery("input#pricefrom").val(value[0]);
				jQuery("input#priceto").val(value[1]);
			};
			$range.ionRangeSlider({
			hide_min_max: true,
			min: 100,
			max: 100000,
			from: 500,
			to: 70000,
			type: 'double',
			step: 100,
 			postfix: " ₽",
			grid: true
		});
		$range.on("change", track).change();
		var slider = $("#range").data("ionRangeSlider");
		jQuery("input#pricefrom").on("change", function () {
			slider.update({from: this.value})
		})
		jQuery("input#pricefrom").val() && jQuery("input#pricefrom").change()

		jQuery("input#priceto").on("change", function () {
			slider.update({to: this.value})
		})
		jQuery("input#priceto").val() && jQuery("input#priceto").change()    
		});
	})(jQuery);
</script>

UPD: Обновил листинг в соответствии с рекомендациями.

рони 23.05.2015 00:40

nSide,
на всякий случай
вместо строк 11 и 12
var value = this.value.split(";");

и строку 27
дополнить
$range.on("change", track).change();

nSide 23.05.2015 00:56

Цитата:

Сообщение от рони (Сообщение 372013)
nSide,
на всякий случай
вместо строк 11 и 12
var value = this.value.split(";");

и строку 27
дополнить
$range.on("change", track).change();

Эти строки напрямую взяты из примеров с сайта автора слайдера. Но все равно спасибо!
UPD: И действительно, так лучше )) Спасибо!
UPD2: Обновил листинг в соответствии с рекомендациями.

anna4 19.10.2016 11:50

Здравствуйте, извините что не по теме, но очень нужна помощь
Есть скрипт <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<div id="result"></div>
<button onClick="setNumber(this)" value="20">20</button>
<button onClick="setNumber(this)" value="30">30</button>
<button onClick="setNumber(this)" value="40">40</button>
<script>
var result = document.getElementById('result')
var num = 0;
function setNumber(e){
result.innerHTML = num += parseInt(e.value);
}
</script>
<style>
#result{
border:1px solid green;
width:100px;
height:50px;
margin-bottom:10px
}
</style>
</body>
</html>

Как его разъединить. К примеру чтоб кнопка было в низу слева сайта а число отображалось в правом верхнем углу. Буду очень благодарна. Готова заплататить

anna4 19.10.2016 12:01

Вот смотрите prntscr.com/cw5pmd Надо чтоб кнопки допустим были здесь а цифры в другом месте
Код я втавляю в целиком в редакторе

warren buffet 19.10.2016 12:28

togtfo


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