jsonデータをmonacaに表示させたい
表題の通りjsonデータをmonacaに表示させたいと思います。
MANP環境ではphpでjson_encodeして上手くMySQLデータをhtmlに反映できたのですが、
そっくりそのままMonacaで試したところjsonデータが引っ張ってこれてない状況に陥りました。
(json_encodeするphpファイルはサーバーにアップ済みです。)
▼ソースコード▼
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
$.ajax({
type: 'GET',
url: 'http://○○△△.jp/json.php',
dataType: 'json',
success: function(json){
var len = json.length;
for(var i=0; i < len; i++){
$("#a").append(json[i].id + ' ' + json[i].○○ + ' ' + json[i].△△ + '<br>');
}
}
});
</script>
<link rel="stylesheet" href="components/loader.css">
<link rel="stylesheet" href="css/style.css">
2015/12/23/18:26
回答からコードを書き換えました。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
<script src="components/loader.js"></script>
<script src="components/monaca-jquery/jquery.js"></script>
<link rel="stylesheet" href="components/loader.css">
<link rel="stylesheet" href="css/style.css">
<script>
$.ready('deviceready',function(){
//Ajax通信
$.ajax({
type: 'GET',
url: 'http://○○△△.jp/json.php',
dataType: 'json',
success: function(json){
var len = json.length;
for(var i=0; i < len; i++){
$("#a").append(json[i].id + ' ' + json[i].○○ + '<br>');
}
}
//下記を追加してどう言ったエラーが発生しているのか確認する
error: function(XMLHttpRequest, textStatus, errorThrown) {
//ステータスコード:エラーに来る際はたいてい200以外
//今回の場合は正常なJSON以外でも此方に来る
console.log("XMLHttpRequest : " + XMLHttpRequest.status);
//実際のレスポンス
//出力された文字列がJSON形式にのっとっているか見る
console.log("textStatus : " + textStatus);
//どうしてエラーが発生したのかのメッセージ
console.log("errorThrown : " + errorThrown.message);
}
});
},false);
</script>
</head>
<body>
<div id="a"></div>
</body>