Jquery가 페이지에 잘못된 값을 전달합니다.

Question

저는 며칠 동안이 문제로 어려움을 겪었습니다. 이 작동하지만 올바른 변수를 페이지 (testMap.php)에 전달하지 않습니다. 내 DB에서 데이터를 사용하고 링크를 가리키면 URL에 올바른 변수가 표시되지만 jquery는 항상 루프의 첫 번째 변수를 잡아냅니다. 어떤 제안?

<?php 
    $myname = $_SESSION['username']; 
    global $database; 
    $stmt = $database->connection->query("SELECT * FROM ".TBL_FLIGHTS." WHERE username='$myname'"); 

     while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){ 
      $date  = $row['date']; 
        $starting = $row['starting']; 
        $ending  = $row['ending']; 
        $route  = $row['route']; 
        echo "<a class=\"route\" href=\"start=$starting&end=$ending\"><p class=\"pBlue\">$date - $starting - $ending - $route</p></a>"; 
        ?> 
     <div id="start" style="visibility:hidden"><?php echo $starting; ?></div> 
     <div id="end" style="visibility:hidden"><?php echo $ending; ?></div> 
     <? 
    } 

    ?> 


<script type="text/javascript"> 
$(document).ready(function() { 
    var start = $('#start').text(); 
    var end = $('#end').text(); 

    $(function() { 
     $(".route").click(function(evt) { 
     $("#mymap_canvas").load("testMap.php?start="+start+"&end="+end) 
     evt.preventDefault(); 
     }) 
    }) 

}); 
</script> 

Answer 1

사실; 클릭 이벤트 내에서 시작 및 끝 값을 캡처하고 클릭 한 경로 근처의 시작 및 끝 값을 선택해야합니다. 아마도

당신이 원하는 :

$(".route").click(function(evt) { 
    var start = $(this).siblings(".start").text(); 
    var end = $(this).siblings(".end").text(); 
    $("#mymap_canvas").load("testMap.php?start="+start+"&end="+end) 
    evt.preventDefault(); 
}); // I believe you are missing a semicolon here and at the end, too 

을하지만 뭔가를 누락하지 않는 한 당신은 정말 PHP를 통해 그 HREF를 만들 수있다 (당신은 이미 제외처럼 전체 경로 및 쿼리 문자열을 완성) 다음과 다음과 같이 실행하십시오 :

$(".route").click(function(evt) { 
    // Load the href of the route anchor into 'mymap_canvas' 
    $("#mymap_canvas").load($(this).attr("href")); 
    event.preventDefault(); 
    return false; // Prevent the normal click behavior 
}); 

숨겨진 시작과 끝은 더 이상 없습니다! 그러나 원래 앵커 태그를 다음과 같이 업데이트하십시오.

<a class=\"route\" href=\"testMap.php?start={$starting}&end={$ending}\">...</a> 

Answer 2

<?php 
    $myname = $_SESSION['username']; 
    global $database; 
    $stmt = $database->connection->query("SELECT * FROM ".TBL_FLIGHTS." WHERE username='$myname'"); 
$i=1; 
     while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){ 
      $date  = $row['date']; 
        $starting = $row['starting']; 
        $ending  = $row['ending']; 
        $route  = $row['route']; 
        echo "<a class=\"route\" href=\"start=$starting&end=$ending\"><p class=\"pBlue\">$date - $starting - $ending - $route</p></a>"; 
        ?> 
     <div class="start<?php echo $i; ?>" style="visibility:hidden"><?php echo $starting; ?></div> 
     <div class="end<?php echo $i ?>" style="visibility:hidden"><?php echo $ending; ?></div> 
     <? 
    $i++; } 

    ?> 


<script type="text/javascript"> 
$(document).ready(function() { 
    var start = $('.start1').text(); 
    var end = $('.end<?php echo $i; ?>').text(); 

    $(function() { 
     $(".route").click(function(evt) { 
     $("#mymap_canvas").load("testMap.php?start="+start+"&end="+end) 
     evt.preventDefault(); 
     }) 
    }) 

}); 
</script>