JSFiddle - React, Tailwind, and code Playground

HTML

<form method="post" action="#">
			<div class="formCost">
				<label for="minCost">Цена: от</label> <input type="text" value="0" id="minCost">
				<label for="maxCost">до</label> <input type="text" value="40000" id="maxCost">
			</div>
			<div class="sliderCont">
					<div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div class="ui-slider-range ui-widget-header" style="left: 0%; width: 100%;"></div><a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 0%;"></a><a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 100%;"></a></div>
			</div>
		</form>

JavaScript

jQuery(document).ready(function(){
/* слайдер цен */
jQuery("#slider").slider({
min: 0,
max: 200,
values: [0,200],
range: true,
stop: function(event, ui) {
value01 = jQuery("#slider").slider("values",0);
value02 = jQuery("#slider").slider("values",1);
if(value01 < 100){
vL1 = value01*10;
vL1 = Math.round(vL1/10) * 10;
jQuery("input#minCost").val(vL1);
}
else
{
R1 = value01 - 100;
vR1 = 390*R1+1000;
vR1 = Math.round(vR1/100) * 100;
jQuery("input#minCost").val(vR1);
};
if(value02 < 100){
vL1 = value02*10;
vL1 = Math.round(vL1/10) * 10;
jQuery("input#maxCost").val(vL1);
}
else
{
R1 = value02 - 100;
vR1 = 390*R1+1000;
vR1 = Math.round(vR1/100) * 100;
jQuery("input#maxCost").val(vR1);
};
},
slide: function(event, ui){
value01 = jQuery("#slider").slider("values",0);
value02 = jQuery("#slider").slider("values",1);
if(value01 < 100){
vL1 = value01*10;
vL1 = Math.round(vL1/10) * 10;
jQuery("input#minCost").val(vL1);
}
else
{
R1 = value01 - 100;
vR1 = 390*R1+1000;
vR1 = Math.round(vR1/100) * 100;
jQuery("input#minCost").val(vR1);
};
if(value02 < 100){
vL1 = value02*10;
vL1 = Math.round(vL1/10) * 10;
jQuery("input#maxCost").val(vL1);
}
else
{
R1 = value02 - 100;
vR1 = 390*R1+1000;
vR1 = Math.round(vR1/100) * 100;
jQuery("input#maxCost").val(vR1);
};
}
});
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);
}
if(value1 < 1000){
vL1 = value1/10;
jQuery("#slider").slider("values",0,vL1);
}
else
{
R1 = value1 - 1000;
vR1 = Math.round(R1/390+100);
jQuery("#slider").slider("values",0,vR1);
};
});
jQuery("input#maxCost").change(function(){
var value1=jQuery("input#minCost").val();
var value2=jQuery("input#maxCost").val();
if (value2 > 40000) { value2 = 40000; jQuery("input#maxCost").val(40000)}
if(parseInt(value1) > parseInt(value2)){
value2 = value1;
jQuery("input#maxCost").val(value2);
}
if(value2 < 1000){
vL1...