[SERblY]

в форме все есть, все подгружаеться посредством аякса, я же как то смог его прикрутить, если надо дам доступ, вот короче говоря как это все работает:

<div class="bg-light" style="padding:10px; border:2px solid #29abe0; box-shadow: 0 1px 14px 0 rgba(24,80,120,.5)">
<a href="#" onclick="divOp(0);"><i class="material-icons closedsearch">clear</i></a> 
{%******* доп. поля *******%}
  <div class="block_search_ajax"></div>

далее подключаеться :

<script src="{%$smarty.const.THEME%}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>
<link href="{%$smarty.const.THEME%}assets/jquery-ui/jquery-ui.css" rel="stylesheet"/>

.............

специально еще захвачу два поля чекбоксы и т.д., все подключается в зависимости от условия, это для примера. но меня конкретно интересует ползунок добрые люди,

{%if $field.type == 'r'%}
					 <div class="form-group">
    <div class="custom-control custom-radio">
      <input type="radio" id="customRadio1" name="{%$id%}" class="custom-control-input" value=''>
      <label class="custom-control-label" for="customRadio1">&nbsp;{%$locale.204%}</label>
    </div>      
     {%foreach  from=$field.values_array item='vl' key='k'%}
    <div class="custom-control custom-radio">      
      <input type="radio" id="customRadio{%$vl%}" name="{%$id%}" class="custom-control-input" value='{%$k%}'>
      <label class="custom-control-label" for="customRadio{%$vl%}">&nbsp;{%$vl%}</label>
    </div>   
						{%/foreach%}
           </div>
					{%/if%}
     


					{%if $field.type == 'c'%}
            
						{%foreach  from=$field.values_array item='vl' key='k'%}
			<div class="form-group">			 
    <div class="custom-control custom-checkbox">
      <input type="checkbox" name="{%$id%}[{%$k%}]" class="custom-control-input" id="customCheck{%$vl%}" value="{%$k%}">
      <label class="custom-control-label" for="customCheck{%$vl%}">&nbsp;{%$vl%}</label>
           </div>
						{%/foreach%}
            
					{%/if%}



					{%if $field.type == 'p'%}




			<div class="row">
    <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="col-md">
      <select style="padding:3px" size='1' name="{%$id%}[rate]" class="form-control price_field custom-select">

            				{%foreach  from=$field.rates item='rates'%}

            				    <option {%if $rates_default.id == $rates.id%}selected{%/if%} value="{%$rates.id%}"><strong>{%if $rates.id == 1 %}&#x584;{%/if%}{%if $rates.id == 2 %}${%/if%}{%if $rates.id == 3 %}&euro;{%/if%}</strong></option>

            				{%/foreach%}

                        </select>
      </div>
      </div>

----------------------------------------------
     <div class="clearfix" style="height:10px"></div>
			<div class="sliderCont">
					<div id="slider"></div>
			</div>
			<div class="clearfix" style="height:10px"></div>
-----------------------------------------------------

    

					{%/if%}

				</div>

			{%/if%}

		{%/foreach%}



            			<div class="row">
    <div class="col-md">


         

            <div class="custom-control custom-checkbox">

<input class="custom-control-input" id="defaultCheckimages" name="must[images]" type="checkbox" value="ON" /> 
                  <label class="custom-control-label" for="defaultCheckimages" style="cursor: pointer">
    только с фото
  </label>
            </div>

             </div>
            
			{%foreach from=$fields key='k' item='field'%}
                
				{%if $field.type == 'f' OR  $field.type == 'y' OR  $field.type == 'j'%}
                    <div class="col-md">
                    <div class="custom-control custom-checkbox">

					    <input class="custom-control-input" id="defaultCheck{%$k%}" name="must[{%$k%}]" type="checkbox" value="ON" /> 
              <label class="custom-control-label" for="defaultCheck{%$k%}" style="cursor: pointer">
              {%$field.name%}
                   </label>
                    </div>
            </div>
				{%/if%}
            
			{%/foreach%}