Как получить доступ к этому ассоциативному массиву в javascript?

Question

У меня есть php-файл, где я извлекаю данные из базы данных, и я хочу получить доступ к его содержимому в javascript. Когда я пытаюсь получить доступ к массиву с данными [0] .card_id, я получаю «undefined».

Вот мой Javascript

$(document).ready(function() { 
    var userId = 1; 
    var updateUrl; 

    $.ajax({ 
    type: "POST", 
    url: "url", 
    data: {userId: userId}, 
    success: function(data) { 
     alert(data[0].card_id); 
     var suffix = ".html"; 
     fb.start('../Animations/' + updateUrl[0].card_id + suffix); 
    } 
    }); 
} 

Вот мой PHP файл

<?php 

include('connect.php'); 

$user_id = $_POST['userId']; 

$db = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname); 
// Check connection 
if (mysqli_connect_errno()) { 
    echo "Failed to connect to MySQL"; 
} 

$select = "SELECT card_id FROM decks WHERE id=$user_id ORDER BY order_num"; 
$result = mysqli_query($db, $select); 

while ($row = mysqli_fetch_array($result, MYSQL_ASSOC)) { 
    $animation[] = array(
     'card_id' => $row['card_id'], 
    ); 
} 

json_encode($animation); 
echo $animation; 
mysqli_close($db); 
?> 

Массив содержит следующие данные

Массив ( [0] => едят [1 ] => мумия

и т. Д. )

Answer 1

У вас есть две проблемы.

Во-первых: Вы ничего не делаете с возвращаемым значением json_encode.

Во-вторых: PHP утверждает, что он отправляет обратно HTML, поэтому в любом случае он не будет разбираться как JSON.

header("Content-Type: application/json"); 
echo json_encode($animation); 

Answer 2

Вам необходимо добавить dataType: "json" в ваш вызов ajax.

$.ajax({ 
    type: "POST", 
    dataType: "json", 
    url: "url", 
    data: {userId: userId}, 
    success: function(data) { 
     alert(data[0].card_id); 
     var suffix = ".html"; 
     fb.start('../Animations/' + updateUrl[0].card_id + suffix); 
    } 
}); 

http://api.jquery.com/jQuery.getJSON/

Там нет необходимости изменить тип MIME, JQuery будет обрабатывать это.