Ajaxで、JSONの添え字を表示する

質問

以下のようなソースで、jQueryで、ajax_abc.htmlのid:Abcのボタンを押して、json_abc.phpから、JSON形式で、添え字がMySQLのabcテーブルのid列、値が同じMySQLのabcテーブルのalphabet列の値を全行分受け取り、<p>1:A</p><p>2:B</p><p>3:C</p>というような形でhtmlを生成したいのですが、値を表示することはできるのですが、添え字を表示する方法がわかりません。
どういう風にやれば、表示できるか教えてください。

[ajax_abc.html]
<script type="text/javascript">
$(function(){
$("#Abc").click(function(){
$.post("json_abc.php", {
}, function(json){
$('#Display').html("<p>"+json[1]+"</p>" + "<p>"+json[2]+"</p>" + "<p>"+json[3]+"</p>")
});
});
});
</script>

[json_abc.php]
<?php
$pdo = new PDO('mysql:dbname=test; host=localhost; charset=utf8', 'root');
$st = $pdo->query("SELECT * FROM abc");
$abc = array();
while ($row = $st->fetch()) {
$abc += array (
$row['id'] => $row['alphabet']
);
}
header('Content-Type: application/json; charset=utf-8');
echo json_encode($abc);

[MySQLのabcテーブル]
INT: VARCHAR
1: A
2: B
3: C

回答No.1

sanzero · ベストアンサー

php側でid=>alphabetという配列を作らないで、id=>id:alphabetという配列を作ればいいんじゃないかな。

お礼

なるほど、そうすると簡単に取り出せますね。
ありがとうございます。