PHPからjavascriptに多次元配列（二次元配列）を渡す

下手にコピペでやろうとしてハマってしまって苦労したので覚書。

結局いろんなところのコピペをやめて自分で書いたら一発で出来た。

別にむずかしい話はありませんでした。

要するに、PHPの配列を

[[あ、い、う、え、お]、[か、き、く、け、こ]、[さ、し、す、せ、そ]]

みたいなかたちのテキストに出力できれば、あとはそれをjs側でevalするだけ。

あと$.ajax{}を使う都合上、jQuery必須です。

----------------------------hogehoge.php------------------------

＜？PHP

$sql="SELECT * FROM tablename WHERE hoge = 'hogehoge'";//必要に応じて書き換えて下さい

$rst=mysql_query($sql);//MySQLにクエリを送信

$num=intval(mysql_num_fields($rst))-1;//フィールド数(x)を取得

$y=0;

$arrays ="[";

while( $row =mysql_fetch_array($rst)){//一行ずつ読み込み

$x=0;

$arrays .= "[";

for($x=0;$x<=$num;$x++){//フィールド数分、カンマ区切りで追加

$arrays .= "'" . $row[$x] . "',";

}

$arrays = rtrim($arrays, ","); //最後のカンマが余るので削除

$arrays .="],";//次の行に移るため、]を閉じる

$y++;

}

$arrays = rtrim($arrays, ","); //最後のカンマが余るので削除

$arrays .="]";//ここまででPHP側の基本的な処理は終了

print $arrays;

？＞

----------------------------index.html----------------------------

＜すくりぷと＞
$.ajax({
type:"post",
url:"hogehoge.php",
async:false,
cache:false,
dataType:"text",
success: function(data){
data2 = eval("(" + data + ")" );
console.log(data2);
});

$.ajax({

type:"post",

url:"hogehoge.php",//作成したPHPファイルのURL

async:false,

cache:false,

dataType:"text",

success: function(data){

var array_data = eval("(" + data + ")");//evalをかけてjs側で配列に格納

console.log(array_data);

};

});

＜/すくりぷと＞

データの取り出し方：

保存データが以下のものだとすると、

[[あ、い、う、え、お]、[か、き、く、け、こ]、[さ、し、す、せ、そ]]

こんな感じの内容になってるはずです。

data2[0][0] ="あ"
data2[0][1] ="い"
data2[0][2] ="う"
data2[0][3] ="え"
data2[0][4] ="お"

data2[1][0] ="か"
data2[1][1] ="き"
data2[1][2] ="く"
data2[1][3] ="け"
data2[1][4] ="こ"

data2[2][0]="さ"
data2[2][1]="し"
data2[2][2]="す"
data2[2][3]="せ"
data2[2][4]="そ"

なので、

alert(data2[0][0]);//「あ」がalertで出る

みたいな書き方でOK。

ここでは書いてませんが、ajaxのdata属性でSQLの構築に必要な情報をPHP側のPOSTで取得、addslashes()やhtmlspecialchars()等で適当にSQLインジェクション対策してSQL文のテーブル名や項目名にしてやる、という感じが実用的と思います。

よろしくどうぞ。

※実際に動かしたプログラムを元に記載してますが、間違いがあればご連絡頂けると幸いです。