JSでajaxリクエストの結果を使用するにはどうすればよいですか？

Question

2行を返すクエリがあります。ここに私のPHPコードです：

$arr = array(); 

$stmt = $dbh_conn->prepare("SELECT id,name FROM mytable WHERE id <= 2"); 
$stmt->execute(); 
$result = $stmt->fetchAll(); 
/*Array 
    (
     [0] => Array 
      (
       [id] => 1 
       [name] => pear 
     ) 

     [1] => Array 
      (
       [id] => 2 
       [name] => watermelon 
     ) 

) */ 

$arr["output"] = $result; 

header('Content-Type: application/json'); 
echo json_encode($arr); 
exit(); 

そして、ここにされた私のJSコード：

success: function(arr) { 
    $(".myclass").html(arr.output.0.name); 
} 

そしてそれは、このスロー：私は.0.nameを削除すると

Uncaught SyntaxError: missing) after argument list

が、それはこのスロー：

Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

とにかくどのように複数の行が選択されている場合、ajaxリクエストの結果を表示できますか？

私がしたいすべて

は、このような結果のHTMLのテーブルです：

<tr> 
    <td>1</td> 
    <td>pear</td> 
</tr> 
<tr> 
    <td>2</td> 
    <td>watermelon</td> 
</tr> 

そして$('.myclass')要素に押し込みます。

Answer 1

JSON.parseを使用して、文字列（data）を解析して配列に戻します。

success: function(data) { 
    var arr = JSON.parse(data); 
    $(".myclass").text(arr.output[0].name); 
} 

配列の添え字を使用します。コメントに記載されているように.myclassのテキストを設定する場合は、.htmlの代わりに.textを使用します。

Answer 2

あなたのデータをJSONとして返された場合は、オブジェクトの配列にアクセスする必要がある、 `arr.output.0.name`があるため、構文エラーです

$(".myclass").text(arr.output[0].name);