javascript - Jquery function in while loop -

javascript - Jquery function in while loop -

i'm new in jquery , have display multiple jquery sliders in 1 page.

i have display slider every time result comes mysql requests. can display 1 slider, can't display multiple sliders, because can't alter name of id in javascript. i'm not able phone call function multiple times... please help.

html page:

<?php $reponse = $bdd->prepare('select id table deleted = 0 '); $reponse->execute(); $slider = array(); $i = 0; while ($data = $reponse->fetch()) { $slider[$i] = $data['id']; $i ++; ?> <div id="<?php echo "slider" . $data['id']; ?>"> </div> <input type="text" id="<?php echo "amount" . $data['id']; ?>"> <?php } ?>

javascript page:

$(function() { var name = "#slider1"; $( name ).slider({ value:100, min: 5, max: 300, step: 5, slide: function( event, ui ) { $( "#amount" ).val( ui.value); } }); $( "#amount" ).val( $( name ).slider( "value" )); });

//edit

slider joined class elements, can't set right value of slidebar amount. have several options take id of current slider moving, none of them work:

$(function() { $( ".slider" ).slider({ value:100, min: 5, max: 300, step: 5, slide: function( event, ui ) { // check event , ui variables see exact reference // element looks it's ui.handle // console.log(ui); // console.log(ui.handle); var clicked_element = ui.handle.data('id'); $( "#amount" + clicked_element ).val( ui.value); } }); $( "#amount3" ).val( $( ".slider" ).slider( "value" )); });

here can seek code :)

html

<div id="slider1"></div> <div id="slider3"></div> <div id="slider4"></div> <div id="slider6"></div> <div id="slider8"></div>

jquery.

for(var = 0; i< count; i++){ (function(i){ var name = "#slider" + i; if($(name)){ $( name ).slider({ value:100, min: 5, max: 300, step: 5, slide: function( event, ui ) { $( "#amount" ).val( ui.value); } }); } })(i); }

in code count count of tag div id=slider+i

update

<?php $reponse = $bdd->prepare('select id table deleted = 0 '); $reponse->execute(); $slider = array(); $i = 0; while ($data = $reponse->fetch()) { $slider[$i] = $data['id']; $i ++; ?> <div id="<?php echo "slider" . $data['id']; ?>"> </div> <input type="text" id="<?php echo "amount" . $data['id']; ?>"> <?php } echo "<script> var count = $i;</script>"; ?>

i have added echo "<script> var count = $i;</script>"; code had been declare val of count;

javascript php jquery