質問: 自社のレンタルサーバー内に設置されたMySQL内に格納されたデータを、客先HP上から取得してHTML上に表示する方法を検討しています。 複数の客先へ配布するもので、それぞれの環境が異なるため、jQueryでデータ取得する方法を考えています。 ※クロスドメイン問題はxdomainajax.jsで解決しようとしています。 ※xdomainajax.jsはそのままでは動かなかったので以下の書き換えをしています。 しかし、うまく取得できないためご助力頂けると大変助かります。 【ざっくりとした手順】 1.客先サーバのpage.htmlをブラウザで開く ・ajaxで自社サーバのdata.phpにアクセス(getでパラメータ送信) ↓ 2.自社サーバのdata.phpにGet付きアクセス ・getのパラメータで絞り込んだデータ(1レコード)をMySQLから取得 ・(返し方が分からないので)echo で表示 ↓ 3.返ってきたデータをpage.html内のタグに表示 ・success:で所定のidが付いたタグ内に取得したデータを表示 【コードサンプル】 page.html内 ``` ``` data.php内 ``` try{ ※pdoでMySQLにクエリ投げる処理 ※id=92のレコード(1行)からカラムpref_nameとdata_nameの値を取得 //クエリで拾ったデータをecho foreach ($data_row as $key => $value) { echo "{"; echo "pref_name:".$value['pref_name'].","; echo "data_name:".$value['data_name']; echo "}"; } } ``` 実行後のpage.htmlの内 ``` <html> <head/> <body>  {pref_name:aaa,data_name:bbb} </body> </html> ``` ...上記のように、データは取得出来たのですが、というタグの中に入ったHTMLデータ(しかもエスケープされた文字列)が返ってきてしまい、何故こうなるのかと頭を悩ませています。もう上記から{}内の文字列を配列に格納してしまおうかとも思いましたが多分本来の方法ではない気がして、よりスマートな取得・表示方法を知りたくて質問しました。 **本当にやりたいこと** * 取得したaaaとbbbをそれぞれid="pref_name"とid="data_name"のIDがついたタグの中に表示させたい **出来ないこと** * jQueryにどう記述すればaaaとbbbだけを抜き取れるか * PHPにどう記述すれば返ってくるデータにhtmlとかheadとかbodyとか不要なものがくっつかなくなるか よろしくお願いいたします。
回答: > > jQueryにどう記述すればaaaとbbbだけを抜き取れるか > > > PHPを見た感じJSON形式で返したいように見受けられます。 受け取る側もJSONを指定しましょう。 * 使ってみようAjax!前編〜AjaxとJSONを合わせて使ってみる〜 ``` dataType: "json" ``` を指定すると、配列の形式で`data`が返ってきます。 例えば、複数レコードあるとしたら`data[0].pref_name`で、1番目のデータの`pref_name`、 と言った具合に返ってきた情報へのアクセスが可能となるはずです。 あとはforなりなんなりで配列`data`をループして出力したい形に整形します。 例: ``` html=""; for(i=0;i"; html+= "pref_name:"+data[i].pref_name; html+= "|data_name:"+data[i].data_name; html+= ""; } html+=""; $('#container').html(html); ``` ※あくまでサンプルです。ご自身のデータの状態にあわせて調整してください ※php時点でhtmlspecialchars()はかけておいた方が良いです 追記: php側でforeachかけなくても、 ``` echo json_encode($data_row); ``` だけでいいかもしれませんね。 json_encode()は第2引数でオプションを色々と指定できるので用途にあわせて調整してください。 ※この場合だとhtmlエスケープかけられないので事前にかけた配列を作って返すなど工夫が必要です > > PHPにどう記述すれば返ってくるデータにhtmlとかheadとかbodyとか不要なものがくっつかなくなるか > > > さらに追記: $.ajax()のsetting部分を見ますと、 datatypeについては指定されていない場合、デフォルト値をjQuery側が判別しているようなので htmlと判別されて~がくっついてきたんでしょうね。 html()を利用されているのでエスケープはjQueryでの出力時よりも phpからの返却時にエスケープされたのかなとは思います(未検証ですが) json出力で決まっているのでしたら、header()でapplication/jsonを指定したほうが良いですね。 * 参考:StackOverflow:PHPで値を JSON 形式で表示したい場合、 header('content-type: application/json;')は必要?