0

JavaScript の問題があり、さまざまな解決策を試しましたが、この問題を正しく解決する方法がわからないので、助けを求めています。

このコードの目的は、ユーザーと同じ数の jQuery スライダーをビューに表示することです。私はこのjQueryスライダーを使用しています: http://jqueryui.com/slider/#rangemax

私の例では、6 人のユーザーがいます。問題は、スライダーのハンドルを動かしたときに、JS が各ユーザーの「dailyAmount」入力を更新できないことです。最後のユーザーに対してのみ機能します。ページでアクティブなままになっているJSコードは、最後の反復のみに対応するものであると想定しています..

ここにコードがあります。私は数日間解決策を探していますが、さまざまなコミュニティでそれについての議論は見つかりませんでした.

私はこのコードを持っています(問題を明らかにするために簡略化されています):

PHPコードの開始

<?php
$ii = 0;
foreach($userList as $user){
     $threshold = $user->getCurrentThreshold();
     $dailyThreshold = $threshold->getDailyThreshold();
     $dailySlider = "dailySlider".$ii;
     $dailyAmount = "dailyAmount".$ii;
     $weeklyAmountId = "weeklyAmount".$ii;
?>

反復ごとに動的 ID を取得する Javascript コード

<script type="text/javascript">
                var sliderId = '#dailySlider'+<?php echo $ii; ?>;
                var dailyAmount = '#dailyAmount'+<?php echo $ii; ?>;
                 $(function() {
                     $(sliderId).slider({
                         range: "max",
                         min: 1,
                         max: 4,
                         value: <?php echo $dailyThreshold ?>,
                         slide: function( event, ui ) {
                            // alert(sliderId);
                            $(dailyAmount).val( ui.value );
                         }
                     });
                     $(dailyAmount).val( $(sliderId).slider( "value" ) );
                });
</script>

HTMLコード

<div class="threshold">
     <form>
          <fieldset>
               <input type="text" id=<?php echo $dailyAmount ?>>
               <div id=<?php echo $dailySlider ?>></div>
          </fieldset>
    </form>
</div>

$ii をインクリメントして foreach 反復を終了するための PHP コードの終わり

<?php>
$ii++;
}
?>

各ユーザーのハンドルを移動するときに、スライダーによって「dailyAmount」をリアルタイムで更新するアクティブな JS コードを作成するにはどうすればよいですか?

あなたの提案を事前にありがとう!

4

1 に答える 1