PHP에서 foreach 문제가있는 jQuery 슬라이더

Question

자바 스크립트 문제가 있습니다. 다른 해결책을 시도했지만이 문제를 해결하는 방법을 알지 못해서 도움이 필요합니다.

이 코드의 목적은 사용자가있는만큼 많은 jQuery 슬라이더를 뷰에 표시하는 것입니다. 내가이 jQuery를 슬라이더를 사용하고 있습니다 : 내 예에서 http://jqueryui.com/slider/#rangemax

을, 나는 6 사용자를 가지고, 문제는 내가 슬라이더의 핸들을 moove 때 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를 얻을 :

나는 (당신에게 문제를 노출 간체)이 코드를

<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> 

는

PHP 코드의 HTML 코드

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

끝, 내가 활성 JS 코드를 가질 수 있습니다 어떻게 foreach는 반복

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

을 $ II를 증가하고 닫습니다 각 사용자에 대한 핸들을 moove 할 때 슬라이더로 'dailyAmount'를 실시간으로 업데이트 하시겠습니까?

고맙습니다. 미리 제안 사항을 보내 주시기 바랍니다.

Answer 1

다음과 같이 시도해보십시오.

<?php 
ini_set('display_errors', true); 
error_reporting(E_ALL); 
// you should have error reporting on. 

// get $userList as usual... 

$ii = 0; // funiest increment var i've seen. Also why don't you use the actual $user ID if you have it. 
foreach($userList as $user) { 
    $threshold = $user->getCurrentThreshold(); 
    $dailyThreshold = $threshold->getDailyThreshold(); 
    $dailySlider = "dailySlider".$ii; 
    $dailyAmount = "dailyAmount".$ii; 
    $weeklyAmountId = "weeklyAmount".$ii; 

// using a data attribute for this made sense, and helps clean up the javascript. 
?> 
<div class="threshold" data-uid="<?php echo $ii; ?>"> 
    <form> <!-- i personally wouldn't put that many forms on the page, and do it with one but obviously I don't know what requirements you have --> 
      <fieldset> 
       <input class="amount" type="text" id="<?php echo $dailyAmount;?>"> 
       <div class="slider" id="<?php echo $dailySlider; ?>"></div> 
      </fieldset> 
    </form> 
</div> 
<?php 
    $ii++; 
} 

?> 

Outside the loop.. 

<script type="text/javascript"> 
$(function(){ 
    $('.threshold[data-uid]').each(function(index){ 
     var uid = $(this).attr('data-uid'); 
     var sliderId = '#dailySlider'+uid; 
     var dailyAmount = '#dailyAmount'+uid; 
      $(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> 

아직 테스트하지 않았지만 의미가 있습니다.