ajaxの成功データのデータへのデータ割り当てが未定義

Question

mysqlクエリでPHPスクリプトを呼び出すajaxを使用して、JavaScriptコードでデータベースからデータを選択しようとしています。 pgpコードは正常に動作しています。私はajaxの成功結果をアラートで見ることができます。しかし、データに変数を代入しようとすると、コンソールには未定義またはNaNとして表示されます。警告に表示され

function zoomBldg() { 

     bldgId = document.getElementById("bldgzoom").value; 

     var bldgStreetAddress,zoomLat,zoomLng,bldgDescription,bldgDefaultPic,zoomCenter; 

     console.log('bldgId',bldgId); 

     $.ajax({ 
      url: "getBldgInfoWajaxGETtest.php", 
      type: "POST",    
      data: {bldgId : bldgId}, 
      dataType: 'json', 
      cache: false, 
      success: function(data) 
      { 
       alert(JSON.stringify(data)); 
       bldgStreetAddress = data[0]; 
       zoomLat = data[1]; 
       zoomLng = data[2]; 
       bldgDefaultPic = data[3]; 

      }, 
      error: function (request, status, error) { 
       console.log(error); 
      } 
     }); 

     zoomLat = parseFloat(zoomLat); 
     zoomLng = parseFloat(zoomLng); 
     zoomCenter = {lat:zoomLat, lng:zoomLng}; 

     console.log('bldgId',bldgId); 
     console.log('bldgStreetAddress',bldgStreetAddress); 
     console.log('zoomLat',zoomLat); 
     console.log('zoomLng',zoomLng); 

    } 

結果されています：

[{ "0"： "50フリーモントストリート"、 "1"： "37.790505"、 "2"：ここに私のコードがあります」 -122.397259" 、 "3"：ヌル、 "building_address"： "50フリーモントストリート"、 "緯度"： "37.790505"、 "経度"： " - 122.397259"、 "default_pic"：NULL}]

結果コンソールには、次のとおりです。

bldgId 17 bldgId 17 bldgStreetAddressが zoomLを未定義at NaN zoomLng NaN

私はデータの[0]などのコードをオンラインからコピーしましたが、私はjsonにあまり慣れていないので、なぜうまくいかないのか分かりません。

Answer 1

コピーと貼り付けのコードを理解してください。 jsonがどのように動作し、JSON.parseとJSON.stringifyが何をするのかを学びます。

jsonの構造を見てください。 情報は配列内にあります。 だからdataは配列です。オブジェクトの各キーは、整数ではない文字列です。

data[0]["1"]

また後で呼び出される成功の機能を持っています。したがって、値は設定されません。これを修正するには、成功コールバックの値を必要とするコードを実行します。

  success: function(data) 
      { 
       alert(JSON.stringify(data)); 
       bldgStreetAddress = data[0]["0"]; 
       zoomLat = data[0]["1"]; 
       zoomLng = data[0]["2"]; 
       bldgDefaultPic = data[0]["3"]; 

       zoomLat = parseFloat(zoomLat); 
       zoomLng = parseFloat(zoomLng); 
       zoomCenter = {lat:zoomLat, lng:zoomLng}; 

    console.log('bldgId',bldgId); 
    console.log('bldgStreetAddress',bldgStreetAddress); 
    console.log('zoomLat',zoomLat); 
    console.log('zoomLng',zoomLng); 

      },