AJAX不分離JSON字符串

Question

我使用星級評分系統來顯示SQL的評分數據。每個可以評分的項目都有唯一的識別變量$ id，而rating tabl中的每個評分都有唯一的識別符$ storyidr。我想這個腳本顯示：

1. 平均得分
2. 次該項目已被評爲數量。

這些值是可退回的，但它們一起顯示在頁面上，我看不出如何分離它們。例如，對於平均評分爲4且評分爲200次的項目。當用戶點擊通過AJAX返回的數據看起來像：

• 對於 '響應1' 4 「200」
• 對於 'RESPONSE2' 4 「200」

我想能夠獨立他們看起來像：

• 對於 '響應1' 4
• 對於 'RESPONSE2' 200

html頁面

<div id="products" style=""> 
    <div class="rateit" data-storyidr="<?php echo $id; ?>"> 
    </div> 
     <div class="averagevote"> 
     <div style="display:block;" id="response<?php echo $id; ?>"><?php echo $avgratep; ?></div><br> 
     <div style="display:block;" id="response2<?php echo $id; ?>">RaTeD <?php echo $rankcount; ?> TiMeS</div> 
     </div> 
     </div> 
    <?php endwhile; mysqli_close($connection); ?> 

    <script type ="text/javascript"> 
     $('#currentslide .rateit').bind('rated reset', function (e) { 
      var ri = $(this); 
      var value = ri.rateit('value'); 
      var storyidr = ri.data('storyidr'); 
      ri.rateit('readonly', true); 
     $.ajax({ 
     dataType : 'json', 
     url: 'rate.php', 
     data: {storyidr: storyidr, value: value}, 
     type: 'POST', 
     success: function (data) { 
      $('#response'+storyidr).replaceWith('Avg rating ' + data.avg + '/5'); 
      $('#response2'+storyidr).replaceWith('Rated ' + data.cnt + ' times'); 

     }, 
      error: function (jxhr, msg, err) { 
      $('#response').append('<li style="color:red">' + msg + '</li>'); 
     } 
    }); 
    }); 
    </script> 

PHP

<?PHP 
      $storyidr=$_POST['storyidr']; 
     $mysqli = mysqli_connect($dbhost,$dbusername,$dbpasswd,$database_name) or die ("Couldn't connect to server."); 
     if (mysqli_connect_errno($mysqli)) 
      { 
      echo "Failed to connect to MySQL: " . mysqli_connect_error(); 
      } 
     $sql = "INSERT INTO ratings (storyidr, rank, entry_date) VALUES ('$_POST[storyidr]','$_POST[value]',now());"; 
     $sql .= "SELECT AVG(rank) AS avrank, COUNT(rank) AS countrank FROM ratings WHERE storyidr = $storyidr"; 
     if($mysqli->multi_query($sql)) 
     { $mysqli->next_result(); 
     if ($result = $mysqli->store_result()) 
     { 
     $data = mysqli_fetch_assoc($result); 
     $avrank = $data['avrank']; 
     $countrank = $data['countrank']; 
     $avrankr = round($avrank,2); 
     if(is_null($avrank)){$avrank ="null";} 
        echo json_encode(array('avg' => $avrankr, 'cnt' => $countrank)); 

     } 
     } 
    ?> 

Answer 1

，才應使用json_encode()一次，並且只能隨聲附和該函數的結果。做一次以上無效的JSON：

else 
    { 
     $results = array(); 
     $results['av'] = $avrankr; 
     $results['cnt'] = $countrank; 

     echo json_encode($results); 
    } 

然後，在你的JavaScript，您可以訪問data.av和data.cnt直接：

$('#response'+storyidr).replaceWith('Avg rating ' + data.av +'/5'); 
$('#response2'+storyidr).replaceWith(data.cnt); 

提到你也設置dataType參數在Ajax調用通過@barell，但通常jQuery將解決這個問題已經正確。

編輯：爲了避免undefined錯誤你得到你應該這樣做：

$results = array('status' => 'fail'); 
... 
if() { 
    ... 

     if ($result) 
     { 
     $results['status'] = 'success'; 
     $results['av'] = $avrankr; 
     $results['cnt'] = $countrank; 
     } 
} 

echo json_encode($results); 

現在你可以檢查data.status先在自己的Ajax調用成功回調，並採取相應的操作：

success: function (data) { 
    if (data.status === 'fail') { 
     // show a warning message somewhere, this is just an example 
     alert('No results found!'); 
    } else { 
     $('#response'+storyidr).replaceWith('Avg rating ' + data.av + '/5'); 
     $('#response2'+storyidr).replaceWith('RaTeD ' + data.cnt + ' TiMeS'); 
    } 
}, 

Answer 2

我認爲問題是你沒有設置正確的標題。在PHP文件，任何輸出之前，把這個：

header('Content-type: text/json'); 

而且也，而不是寫兩個對象，把它寫成一個數組：

echo json_encode(array('avg' => $avrankr, 'cnt' => $countrank)); 

現在它應該工作

然後在你的Javascript，你會訪問這個數據是這樣的：

$('#response'+storyidr).replaceWith('Avg rating ' + data.avg +'/5'); 
$('#response'+storyidr).replaceWith(data.cnt); // Suppose you want the count here