JSONのオブジェクトオブジェクトを残りのインターフェイスから取得する

Question

HTTP GETでデータベースからJSONという列名を返すapache camelを使用して、単純なWebサービスを使用しています。

ボタンクリックでGETがフロントエンドにバインドされています。開発者ツールをクリックすると、私が期待している値を返すXHRデータを見ることができますが、プログラムでそれらを引き出すことはできません。私は読んしようとしているデータの

例：上記のコードでは

[{"COLUMN_NAME":"EID"},{"COLUMN_NAME":"USERID"},{"COLUMN_NAME":"LAST_UPDATE"},{"COLUMN_NAME":"LAST_UPDATED_BY"},{"COLUMN_NAME":"CREATED_DATE"}] 

$(document).ready(function() { 
    $('#getButton').click(function() { 
    $.ajax({ 
     url: 'http://localhost:8090/rs/persons' 
    }).then(function(data) { 
      $.each(data, function(index, value) { 
      $('#dropList').append(
       $('<option>', {text: value}) 
      )}) 
     }); 
    }); 
}); 

、私の選択リスト（ドロップリスト）が返されたセット内の各項目のObjectオブジェクトに移入されます。

ありがとうございます。

Answer 1

valueはオブジェクトを指します。

$('<option>', { 
    text: value.COLUMN_NAME // note the property name here 
}); 

はまた、あなたは一度だけappend()を呼び出す必要があるように、あなたがHTMLの単一の文字列を作成することにより、ロジックを少し最適化することができますのでご注意：テキストを追加するには、そのオブジェクトのプロパティを参照する必要が

var data = [{ 
 
    "COLUMN_NAME": "EID" 
 
}, { 
 
    "COLUMN_NAME": "USERID" 
 
}, { 
 
    "COLUMN_NAME": "LAST_UPDATE" 
 
}, { 
 
    "COLUMN_NAME": "LAST_UPDATED_BY" 
 
}, { 
 
    "COLUMN_NAME": "CREATED_DATE" 
 
}] 
 

 
var html = data.map(function(o) { 
 
    return `<option>${o.COLUMN_NAME}</option>`; 
 
}).join(''); 
 
$('#dropList').append(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="dropList"></select>