javascript - Understanding jQuery UI (basic): How to set the value of a slider -


the real problem have not learned enough basic javascript yet. i'm learning it's got me messed right now.

so figure simple can't put head around yet.

i had code got working great , understood enough, got (and it's works great too) don't understand way select object , change it's value using jquery.

here new code (working great):

.html

<div style="display:block;margin:100px auto;padding:0 8%">     <input type="text" id="amount3" style="border:0 none" class="slider_value">      <div id="slider3" class="slider_container" data-value="0" data-min="0" data-max="15" data-steps="1"></div>      <div class="steps">         <?php         ($i=0, $t=15; $i<=$t ; $i++) {             echo '<span class="tick" style="left:'.(100/$t*$i).'%;';             if ($i==ceil($t/2)) echo 'font-weight:bold;font-size:medium;';             echo '">|<br>'.$i.'</span>';         }         ?>     </div> </div> 

.js

$(function(){     var value, step, min, max, input;      $('.slider_container').each(function(){         input = $(this).prev('.slider_value');         value = $(this).data('value');         step  = $(this).data('steps');         min   = $(this).data('min');         max   = $(this).data('max');          $(this).slider({             value: value,              min: min,              max: max,              step: step,             slide: function(event, ui) {                 $(this).prev('.slider_value').val(ui.value);             }         });          input.val($(this).slider("value"));     }); }); 

with pure html5 slider it's easy change slider value: document.getelementbyid("slider3").value = '5'; not work new code , can't figure out.

i have number of sliders different ids. have onchange event on field fires ajax sql search , returns data use set sliders on page. works fine until added jquery ui... because don't understand how select slider want change.

turned out not hard:

$(p2).slider({   value: 0,   slide: function(event, ui) {     $(this).prev('.slider_value').val(ui.value); } }); 

Comments