Ajax和JSON響應問題

Question

我是一個非常新手的程序員，他正在製作一個應用程序，其中有多個div，其類別爲jcontainer。每個j容器具有與其關聯的ID，其與數據庫中的稱爲apptid的字段相對應。在Jquery中，我每5秒發送一次AJAX請求到php頁面，以檢索數據庫中的currentlocation字段（對應於applet），這發生在每個j容器。

這裏是我的代碼：

HTML：

<div class='jcontainer' data-param='jcontainer_IDNUMBER'> 

    <button class='checkIn' data-param='button_IDNUMBER'>Check In</button> 
    <form method='post' class='myForm' action=''> 
     <select name='locationSelect' class='locationSelect' data-param='location_IDNUMBER'> 
      <option value='1'>Exam Room</option> 
      <option value='2'>Exam Room 2</option> 
      <option value='3'>X-Ray Room</option> 
      <option value='1000'>Check Out</option> 
     </select> 
    </form> 
    <div class='finished' style='color:#ff0000;'>Checked Out</div> 

</div> 

的jQuery：

<script type="text/javascript"> 
$(document).ready(function() { 

    setInterval(function(){ 

    $('.jcontainer').each(function() { 
     var $e = $(this); 
     var dataid = $e.data("param").split('_')[1] ; 

     $.ajax({ 
      url: 'heartbeat.php', 
      method: 'post', 
      contentType: "application/json", 
      dataType: "json", 
      data: dataid, 
      success: function(data){ 
       var msg = $.parseJSON(response); 
       alert(msg); 
      } 
     }); 

    }); 
    },5000); 

    //other code that I didn't post, because it's not really relevant, but can post if needed be 

和PHP頁面：

<?php 

$hostname = 'localhost'; 

$username = '******'; 

$password = '*************'; 

$apptid = $_POST['dataid']; 

$db = new PDO("mysql:host=$hostname;dbname=sv", $username, $password); 
$statement = $db->prepare("SELECT currentlocation FROM schedule WHERE apptid = :apptid"); 
$statement->execute(array(':apptid' => $apptid)); 
$row = $statement->fetch(); 

$currentlocation = array('CurrentLocation' => $row['currentlocation']); 
echo json_encode($currentlocation); 

?> 

的問題是我不能讓來自警報（msg）的任何響應。爲什麼是這樣？我檢查了Chrome Developer，並沒有出現錯誤。

最終目標是將當前位置編號記錄在jQuery變量中。前 - >var currentLocation = Number

感謝您的任何和所有幫助，如果您需要更多的細節來澄清事情，我可以愉快地發佈！

Answer 1

的代碼塊：

success: function(data){ 
      var msg = $.parseJSON(response); 
      alert(msg); 
     } 

應該讀

success: function(data){ 
      var msg = $.parseJSON(data); 
      alert(msg); 
     } 

原因response變量未聲明和不確定的，所以你應該使用data變量在parseJSON方法，即接收到的實際數據。希望這可以爲你解決。

Answer 2

您應該使用$.getJSON()

$.getJSON("heartbeat.php?jsoncallback=?", 
    {dataid}, 
    function(data){ 
     console.log(data); 
    } 
); 

然後在你的PHP，你必須使用jsoncallback像這樣：

echo $_GET['jsoncallback'].'('.json_encode($currentlocation).')'; 

兩件事情在這裏看到。

1，我把從JSON data返回在console，而不是alert()

2，您可能需要檢查你dataid變量，因爲它使用傳統的陣列值（id:3,key:value）方法，而不是「id=3&key=vaule」

Answer 3

你不需要$.parseJSON，jQuery會自動解析JSON，因爲你告訴它dataType: "json"。您的alert應該說Object。使用您的瀏覽器控制檯，並使用console.log(data)來查看對象的結構。

Answer 4

你可以使用我的圖書館，做的是爲你自動http://phery-php-ajax.net

function heartbeat($data){ 
    $r = new PheryResponse; 

    $hostname = 'localhost'; 

    $username = '******'; 

    $password = '*************'; 

    $apptid = $data['id']; 

    $db = new PDO("mysql:host=$hostname;dbname=sv", $username, $password); 
    $statement = $db->prepare("SELECT currentlocation FROM schedule WHERE apptid = :apptid"); 
    $statement->execute(array(':apptid' => $apptid)); 
    $row = $statement->fetch(); 

    // If you want to manipulate the DOM inside the jcontainer use: 
    // $r->this()->find('.locationSelect'); 
    // for examplee 
    return $r->set_var('currentLocation', $row['currentlocation']); //set the global var 
} 

Phery::instance()->set(array(
    'heartbeat' => 'heartbeat' 
))->process(); 

你會改變你的HTML，以適應Phery庫

<div class='jcontainer' data-remote='heartbeat' data-args="<?php echo Phery::args(array('id' => $number)); /* place your number in here */ ?>" id='jcontainer_IDNUMBER'> 
    <button class='checkIn' data-param='button_IDNUMBER'>Check In</button> 
    <form method='post' class='myForm' action=''> 
    <select name='locationSelect' class='locationSelect' data-param='location_IDNUMBER'> 
     <option value='1'>Exam Room</option> 
     <option value='2'>Exam Room 2</option> 
     <option value='3'>X-Ray Room</option> 
     <option value='1000'>Check Out</option> 
    </select> 
    </form> 
    <div class='finished' style='color:#ff0000;'>Checked Out</div> 
</div> 

和你的新的jQuery每個將是：

$('.jcontainer').each(function(){ 
    var $this = $(this); 
    $this.phery('remote'); // call the remote AJAX with the data 
}); 

如果要檢查dev控制檯中的數據，可以使用， PHP變量將被轉儲到控制檯中

$r->dump_var($row, $apptid);