JSON変換データをjavascriptへ渡したい

このQ&Aのポイント
  • json_encode()関数を使用して配列データをJSON形式に変換し、javascriptへ渡したいが、文字列になってしまう
  • 質問文章では、json_encode()関数を使用して配列データをJSON形式に変換し、javascriptへ渡したいという要望がありますが、渡した結果文字列になってしまいます
  • 質問文章では、json_encode()関数を使って配列データをJSON形式に変換し、javascriptへ渡したいという要望がありますが、文字列になってしまう問題が発生しています
回答を見る
  • ベストアンサー

JSON変換データをjavascriptへ渡したい

json_encode()関数で、JSON形式の文字列に変換した配列データをjavascriptへ渡したいのですが、 いつのまにか、ただんの文字列になってしまいます。なんででしょうか? ■コード $jsondata= json_encode($originalarray) <script type="text/javascript"> var result = <?php echo($jsondata) ?>; alert(result); </script> ■変数 ・$originalarray Array ( [0] => ./im/1a.j [1] => ./im/2.j [2] => ./im/9_1.j ) ・jsondata [".\/im\/1a.j",".\/im\/2.j",".\/im\/9_1.jp"] ・result ./im/1a.j./im/2.j./im/9_1.jp

  • re999
  • お礼率61% (476/777)
  • PHP
  • 回答数1
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
  • JaneDue
  • ベストアンサー率75% (263/350)
回答No.1

意図する通り渡っているのではないでしょうか? alert()の引数は文字列です。それ以外が渡された場合、文字列に変換・表示しようと試みます。 alert( result instanceof Array ? 'Yes':'No'); alert( result[1]); とかしてみて下さい。

re999
質問者

お礼

回答ありがとうございました。 再度確認したところ無事渡っていました! >alert()の引数は文字列です。それ以外が渡された場合、文字列に変換・表示しようと試みます おおお! 全く気がつきませんでした >alert( result instanceof Array ? 'Yes':'No'); こんな書き方も出来るのですね。大変勉強になりましたー

関連するQ&A

  • JSONデータをフォームにセットしたい

    JSONデータを「jQuery.val」でフォームにセットしたいのですが、うまくいきません。どうしたら良いでしょうか? 具体的には、[",]が削除された状態でセットされます。元は配列ですが、JSONデータへ変換したので、フォームへセット出来ると思っていたのですが…。 JSONは、「ある形式に沿った文字列」という認識でいたのですが、違うのでしょうか? ■コード $jsondata= json_encode($originalarray) <script type="text/javascript">  var result = <?php echo($jsondata) ?>;  $("input#jsondata").val(result); </script> ■変数 ・$originalarray Array ( [0] => ./im/1a.j [1] => ./im/2.j [2] => ./im/9_1.j ) ・jsondata [".\/im\/1a.j",".\/im\/2.j",".\/im\/9_1.jp"] ・フォームにセットされる値 ./im/1a.j./im/2.j./im/9_1.jp →ここに「jsondata」をセットさせたい

  • Javascriptで複数のjsonを読み込みたい

    Javascriptについてご教授頂きたい点があり、質問しました。 私事で、現在とあるサイトの修正を行なっています。そのサイト内の更新情報の部分がJavascriptで制作されており、具体的にはjson形式のファイルをJavascriptで読み込み、HTMLとして出力する形になっています。 質問下部が、そのJavascriptです。 現在はjsonファイルをひとつだけの読み込んで表示しているのですが、 今後コンテンツの拡充するため、2種類のjsonを読み込む必要がでてきました。 jsonファイルの中身や項目ついては2種類ともほぼ同じような内容です。 考えられる様々な方法を試してみたのですが、うまくいかず、質問させていただきました。 どなたかお力添えを頂けないでしょうか。 var result2 = ''; var rec2 = 5; var jsonHostname = "元々のJSONのディレクトリURL"; var jsonUrl = ''; jsondata2 = ""; function callback_whats_new(data2) {callbackCommon2(data2);} function callbackCommon2(data2) { jsondata2 = data2; if(typeof jsondata2 == 'object'){ draw2(); } else { indexDiv2.innerHTML = '<br><div class="t_m" style="text-align:left; margin-left:8px;">当サイトをご覧いただくには、<br>JavaScriptとFlashの再生環境が必要となります。<br><br>' + '詳しくは「<a href="">ご利用に際して</a>」をご覧ください。<br><br></div>'; } } function getIndex2(n2) { var list = n2; var type = list; indexDiv2 = document.getElementById(type); filename = type; var url = jsonHostname + filename + '.json?' + (new Date().getTime()); 元々入っていたjsonファイルののURL var idval = 'jsonp_' + type; var charset = 'utf-8'; charset = charset ? charset : 'utf-8'; var headObj = document.getElementsByTagName('head')[0]; var scriptTag = document.getElementById(idval); if (scriptTag) { headObj.removeChild(scriptTag); } scriptTag = document.createElement('script'); scriptTag.type = 'text/javascript'; scriptTag.id = idval; scriptTag.charset = charset; scriptTag.src = url; headObj.appendChild(scriptTag); } function draw2(e,n1, n2, n3, n4) { result2=""; if (typeof n1 != 'undefined') turn = n1; if (typeof n2 != 'undefined') cat_2 = n2; if (typeof n3 != 'undefined') category = n3; hl = jsondata2.headline; if(typeof rec2!='number'){ hlLength = hl.length; }else if(rec2 > hl.length){ hlLength = hl.length; }else{ hlLength = rec2; } tMon = 0; for (var i = 0; i < hlLength; i++) { wrHTML2(i); } if (result2) { indexDiv2.innerHTML = result2; } else { indexDiv2.innerHTML = '<span class="t_m">該当する情報はありません。</span>\n'; } if (typeof list == 'object' && listNum < list.length) getIndex2(list); } function wrHTML2(n) { var f = 0; var f2 = 0; var icon=""; var date = (jsondata2.headline[n].date) ? jsondata2.headline[n].date : ""; if (cat_2 && cat_2 != Number(date.substr(4,2))) return; var uri = (jsondata2.headline[n].uri.uri) ? jsondata2.headline[n].uri.uri : ""; var tar = jsondata2.headline[n].uri.target; var no = jsondata2.headline[n].txt.no; var txt = (jsondata2.headline[n].txt.txt) ? jsondata2.headline[n].txt.txt : ""; var jsOpenWinFlg; if (-1!= uri.indexOf("/html/")){ if (-1!= (jsOpenWinFlg = uri.indexOf("/report/"))){ var aElementAttr = 'href="JavaScript:popupWin(\''+uri+'\',\'subwin\',\'900\',\'700\');"'; }else if (-1!= (jsOpenWinFlg = uri.indexOf("/news/other/"))){ var aElementAttr = 'href="JavaScript:popupWin(\''+uri+'\',\'subwin\',\'900\',\'700\');"'; }else{ var aElementAttr = 'href="'+uri+'" target="'+tar+'"'; } }else{ var aElementAttr = 'href="'+uri+'" target="'+tar+'"'; } if (date) date = date.substr(2,2) + '/' + date.substr(4,2) + '/' + date.substr(6); result2 += '<table width="100%"><tr>'; result2 += '<td width="17%" valign="top">' + date + '</td>'; result2 += '<td width="83%" valign="top">'; result2 += '<a ' + aElementAttr + '>' + txt + '</a>'; result2 += '</td>'; result2 += '</tr></table>'; } ​

  • javascriptでJSONを取得する方法

    C#、asp.netでJson形式の文字列をjavascriptに渡してgooglemapで使用したいです。 json.netやらDynamicJson やらがインストールされていないと使用できないのでしょうか。 aspx.cs dynamic dataSet = 取得したlist; System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); serializer.Serialize(dataSet); javascript function json() { $.ajax({ url: ××.aspx.cs, type: "get", dataType: 'json', error: function () { alert("情報の読み込みに失敗しました"); }, success: function (data) {        alert("data"); } }); } こちらでは、情報の読み込みに失敗しましたとアラートが出てしまいます。 http://qiita.com/rbtnn/items/b2ec6c7dee792e66ac75 http://aspnet.keicode.com/basic/jquery-ajax-basics.php この2つのサイトを参考にしています。 dataSetの中身に目的のリストが取得できているのは確認済みです。 何がいけないのでしょうか。 どうやったらJSONをjavascriptで読み込めるのでしょうか。 どなたかよろしくお願いします。

  • JSONのデータから商品名の取得の仕方

    今現在下記の記述でJSONを取得しています。 ===== <html> <head> <title>JSONのデータを使ってみる</title> </head> <script type="text/javascript" src="./prototype.js"></script> <script type="text/javascript"> function execute() { var url = './ItemSearch_json.php'; var paramList = "keyword=" + encodeURIComponent("ふくろう"); var a = new Ajax.Request( url, { method: 'get', parameters: paramList, onSuccess: function(request) { // alert('読み込み成功しました'); // jsonの値を処理する場合↓↓ var json; eval("json="+request.responseText); }, onComplete: function(request) { alert('読み込みが完了しました'); $('container').innerHTML = request.responseText; // jsonの値を処理する場合↓↓ var json; eval("json="+request.responseText); }, onFailure: function(request) { alert('読み込みに失敗しました'); }, onException: function (request) { alert('読み込み中にエラーが発生しました'); } } ); } </script> <body> <div id="container">content</div> <button onclick="execute()">サンプル実行</button> </body> </html> ===== このままだと、プレーンテキストは表示されるのですが、商品名や価格の一覧などを選択して表示できません。 evalなどを使うのかなと思うのですが、はっきり分かりません。 ヒントを教えていただけないでしょうか。

    • ベストアンサー
    • AJAX
  • jquery,ajaxによるphp通信でnull

    初めまして。 現在jqueryを勉強中の学生です。 いろいろなサイトを参考にしつつ、試しににjquery・ajaxを使ったphpとの通信を試みているのですが、文字列のやりとりがうまくいきません。 数字ではうまくいくのですが、文字になるとalertの部分でnullと返されてしまいます。 アドバイス等頂ければと思います。 よろしくお願いいたします。 以下部分的ではありますがコードを示します。 (jqueryはjquery-1.11.1.min.jsを使用) [js] $.ajax({ type: "POST", url: "step1.php", data: send_data, success: function(receive_data) { var parseAr = JSON.parse(receive_data); alert(parseAr[0]['name']); }, error: function(XMLHttpRequest, textStatus, errorThrown) {alert('Error: ' + errorThrown); } }); return false; [php側] <?php if(isset($_POST['name'])) { $result = array(); $result[] = array('name'=>'織田', 'age'=>'33'); $result[] = array('name'=>'織田', 'age'=>'33'); echo json_encode($result); } else { echo json_encode('The parameter of "name" is not found.'); } exit; ?>

  • 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

    • ベストアンサー
    • AJAX
  • 別URLからのJSON取得がうまくいかないので教えてください

    楽天書籍検索APIをJSONで取得したいのですが、うまく表示されません。 以下のソースで何がまずいか教えていただけますでしょうか。 ※[YOUR_developerID]にはIDが入っているものとします <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>JSON</title> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.2.6");</script> <script type="text/javascript"> $(function(){ $.getJSON("http://api.rakuten.co.jp/rws/2.0/json?developerId=[YOUR_developerID]&operation=BooksTotalSearch&version=2009-03-26&keyword=%E3%82%AC%E3%83%B3%E3%83%80%E3%83%A0&sort=-releaseDate", function(jsonData){ $(jsonData.Body.BooksBookSearch.Items.Item).each(function(){ $("body").append(this.title+"<hr />"); }) }) }) </script> </head> <body>

  • javascriptでjsonの解析で困っています

    以下のようなjsonのデータの中から、ccと33をとりだし、変数に代入しようとしています。 jsonのデータは読み込めているのですが、その後の var myData = JSON.parse(this.responseText); x = myData.we[0][2][0]; y = myData.we[0][2][1]; としてるのですが、代入ができていません。データの構造が間違っていますか?x = myData.we[0][2][0];  y = myData.we[0][2][1]; の部分が間違っていますか?javascript jsonについては初心者です。詳しく教えていただきたく思い投稿しました。よろしくお願いします。 ------ json --------------------------------------- { "wd":[ [          ["a",1],["b",2],["c",3],["d",4],["e",5]      ], [          ["f",6],["g",7],["h",8],["i",9],["j",0]      ] ], "we":[ [          ["aa",11],["bb",22],["cc",33],["dd",44],["ee",55]      ], [          ["ff",66],["gg",77],["hh",88],["ii",99],["jj",00]      ] ] }

  • 【PHP,JavaScript】文字が誤変換される

    以下は、プログラムの一部でJavaScriptからPHPにJSONデータを送信する処理です。 引数を渡すJavaScript側(Extjsライブラリを利用)のプログラム // Ajaxリクエスト処理 Ext.Ajax.request({ url: "php/updatedata.php", success: handleSuccess, failure: handleFailure, params: { data: Ext.util.JSON.encode(data) } // パラメータをJSON形式にして送信 }); 配列dataの中身は「data[0] = 3,data[1] = パソコン」となっています。 Ext.util.JSON.encode(data)により配列dataをJSONに変換して 受信するPHP側のプログラム:updatedata.php JavaScriptで渡したJSONを$_REQUEST['data']で受信して中身を見ると以下のようになっています。 if (isset($_REQUEST['data'])) { $tmp = $_REQUEST['data']; 【受信したJSONデータの中身】 [{"id":"3","name":"繝代た繧ウ繝ウ"}] 「パソコン」という文字列が「繝代た繧ウ繝ウ」という文字列に変換されてしまっています。 Extjs側の「Ext.util.JSON.encode」が悪いのでしょうか、それともPHP側の「$_REQUEST」が悪いのでしょうか。はたまた何か別の原因があるのでしょうか。 ちなみに、環境は以下のようになっています。 WindowsXP,Windows7(両方とも同じ結果になってしまいました。) PHP5.3.1 Ext3.3.0 以上、よろしくお願い致します。

  • JavaScriptでレーダーチャート表示

    JavaScriptでレーダーチャートを表示したくて html5jp様のライブラリを使用しているのですが 「"angle_num"が宣言されていません」とエラーが表示されてしまい 表示できません。 ちなみにクエリ文字列からデータを取得しています。 どなたか解決お願いします。 ソースは以下のようになってます。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="ja" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>title</title> <style type="text/css"> canvas {border:0px solid #4c4c4c;} </style> <!--[if IE]><script type="text/javascript" src="graph_radar_1_0_0/html5jp/excanvas/excanvas.js"></script><![endif]--> <script type="text/javascript" src="graph_radar_1_0_0/html5jp/graph/radar.js"></script> <script type="text/javascript"> function $q(){ var result = {}; var str = location.search.substring(1); var paramss = str.split('&'); for(var i = 0;i < paramss.length; i++){ var kv = paramss[i].split('='); result[kv[0]] = decodeURIComponent(kv[1]); } return result; } var q = $q(); for(var j = 1; j < 21; j++){ /* document.write(q['a'+j] + " "); */ q['a'+j]-=0; /* document.write(typeof q['a'+j]); */ } window.onload = function() { var rc = new html5jp.graph.radar("sample"); if( ! rc ) { return; } var items = [ [ q.a0, q.a1, q.a2, q.a3, q.a4, q.a5, q.a6, q.a7, q.a8, q.a9, q.a10], ["ave.", q.a11, q.a12, q.a13, q.a14, q.a15, q.a16, q.a17, q.a18, q.a19, q.a20] ]; var params = { aCap: ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j"], aMax: 5, aMin: 0 }; rc.draw(items, params); }; </script> </head> <body scroll="no"> <div><canvas width="300" height="200" id="sample"></canvas></div> </body> </html>

専門家に質問してみよう