雨の日回答ポイント 200pt

楽天APIに関する質問です。

javascript（jQuery)を使って、リクエスト＆帰ってきたデータの整形をしたいのですが、うまく取得できません。
原因を教えて頂ければと思います。

■javascript
//表示件数
var max_count = 10;
//URL ※楽天アプリIDは置き換え
var url = "https://app.rakuten.co.jp/services/api/AuctionItem/Search/20130110?applicationId=楽天アプリID&format=json&sort=%2BitemPrice&keyword=";

jQuery(document).ready(function($){
$("#search_box").on('keypress', function(e) {
if(e.which == 13) {
$("#result_list ul").empty();
var key = encodeURI($(this).val());
var url_ra = url + key;
var arr_ra = [];
$.ajax(
url_ra,
{
crossDomain: true,
dataType: 'jsonp',
success: function(data) {
var item = data.Items.Item;
for (var i in item) {
arr_ra.push([
item[i].itemName,
item[i].itemPrice
]);
}
},
error: function() {
alert("エラー");
}
}
);
for(var j = 0; j < max_count; j++) {
$("#result_list ul").append('<li>' + arr_ra[j][0] + '：' + arr_ra[j][1] + '</li>');
}
}
});
});

■html
<div id="search_box"><input type="text" /></div>
<div id="result_list">
<ul>
</ul>
</div>

※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ログインして回答する

ベストアンサー

TransFreeBSD2014/03/11 22:40:33
満足200pt
```
for(var j = 0; j < max_count; j++) {
    $("#result_list ul").append('<li>' + arr_ra[j][0] + '：' + arr_ra[j][1] + '</li>');
}
```
エラーはここで起こっていますよね？
これの位置が $.ajax() の後にありますが、このfor文の意図はデータ取得時に取得内容を表示するというものですよね？
ならばsuccess内で行うべきです。
今の位置だとajax登録後、取得前なので arr_ra は空の配列で[0]はundefinedなのでarr_ra[0][0]はエラーになります。
ajaxでのデータ取得はスクリプトが一旦終了し、ブラウザに制御が戻った後となります。
スター
- 3件のコメントを見る
- 雨の日 2014/03/12 18:28:59
  ご回答ありがとうございます。
  ご指摘頂いた箇所を直したのですが相変わらず「Cannot read property '0' of undefined」となってしまいます。
  ちなみに下記のようの修正したのですが、何か間違えているのでしょうか？
  success: function(data) {
  var item = data.Items.Item;
  for (var i in item) {
  arr_ra.push([
  item[i].itemName,
  item[i].itemPrice
  ]);
  }
  for(var j = 0; j < max_count; j++) {
  $("#result_list ul").append('
  ' + arr_ra[j][0] + '：' + arr_ra[j][1] + '
  ');
  }
  },
  
  スター
- TransFreeBSD 2014/03/12 21:02:01
  返ってくるデータはitemが配列なのではなくitemsが配列ではないですか？
  楽天のテストフォームだと
  data.items.item[0].itemName
  ではなく
  data.items[0].item.itemName
  になってるっぽいですが。
  for (var i in data.items) { arr_ra.push([ data.items[i].item.itemName, data.items[i].item.itemPrice ]); }
  
  あと、max_countが決め打ちなので、これより少ないとエラーは出ます。
  ただ、ある分だけは表示されると思いますが……
  max_countじゃなくdata.hitsを使うと良いのでは。
  というか、for文を分ける必要なければ
  for(var i = 0; i < data.hits; i++) { $("#result_list ul").append('<li>' + data.items[i].item.itemName + '：' + data.items[i].item.itemPrice + '</li>'); }
  で良いのでは。
  取得数はhitsパラメータで指定できます。
  
  ところでブラウザはなに使ってます？
  ブレークポイント仕掛けてdataとか変数を期待通りか直接確認すると捗りますよ。
  
  スター
- 雨の日 2014/03/12 22:53:30
  
  ありがとうございます。
  無事取得できました。
  またブラウザはchromeを使っているのですが、ブレークポイントを仕掛けれる等知りませんでした。
  使ってみたら仰るとおり捗ります！
  本当にありがとうございました。
  
  スター

その他の回答

雨の日
2014/03/11 21:50:41

補足です。
エラー内容は「Cannot read property '0' of undefined」となっています。
また、楽天APIの仕様は以下になります。
https://webservice.rakuten.co.jp/api/auctionitemsearch/

楽天APIに関する質問です。

ベストアンサー

TransFreeBSD2014/03/11 22:40:33
満足200pt

雨の日 2014/03/12 18:28:59

TransFreeBSD 2014/03/12 21:02:01

雨の日 2014/03/12 22:53:30

その他の回答

雨の日
2014/03/11 21:50:41

この質問へのコメント

この質問への反応（ブックマークコメント）

質問の情報

この質問のカテゴリ

この質問に含まれるキーワード

人気の質問

メニュー

PC版

楽天APIに関する質問です。

ベストアンサー

TransFreeBSD2014/03/11 22:40:33 満足200pt

雨の日 2014/03/12 18:28:59

TransFreeBSD 2014/03/12 21:02:01

雨の日 2014/03/12 22:53:30

その他の回答

雨の日 2014/03/11 21:50:41

この質問へのコメント

この質問への反応（ブックマークコメント）

質問の情報

この質問のカテゴリ

この質問に含まれるキーワード

人気の質問

メニュー

PC版

TransFreeBSD2014/03/11 22:40:33
満足200pt

雨の日
2014/03/11 21:50:41