Пытаюсь сделать поле ввода для range slider jquery ui с пробелом:
$('.slider-element').each(function() {
var $this = $(this),
container = $this.closest('.slider'),
min = parseInt($this.data('min')),
max = parseInt($this.data('max')),
from = container.find('.from'),
to = container.find('.to');
console.log(parseInt(from.val()));
from.change(function() {
var value1 = from.val(),
value2 = to.val();
if(parseInt(value1) > parseInt(value2)){
value1 = value2;
from.val(value1);
}
$this.slider('values', 0, from.val()).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1 ");
console.log();
});
to.change(function() {
var value1 = from.val(),
value2 = to.val();
if(parseInt(value1) > parseInt(value2)){
value2 = value1;
to.val(value2);
}
$this.slider('values', 1, to.val());
});
$this.slider({
range: true,
min: min,
max: max,
step: 83,
values: [min, max],
slide: function(event, ui) { // При каждом перемещении
var values = $(this).slider('option', 'values');
from.val(ui.values[0]);
to.val(ui.values[1]);
},
change: function(event, ui) { // В конце перетаскивания
console.log('change');
},
create: function() { // При создании виджета
var values = $(this).slider('option', 'values');
from.val(values[0]);
to.val(values[1]);
},
stop: function(event, ui) { // При завершении перетаскивания
}
});
});
<div class="slider">
<div class="slider-display">
<input type="text" name="slider" class="input from" >
<input type="text" name="slider" class="input to">
</div>
<div class="slider-element" data-min="0" data-max="1000"></div>
</div>
<script src="https://code.jquery.com/jquery-2.0.3.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Использую .replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1 ")
, но видимо не правильно.
Не пойму что не так в коде, как осуществить такой формат ввода 12 345
: