ajaxからコントローラから返されたリストの値にアクセスするにはどうすればよいですか？

Question

私はコントローラからリストを返しています。 AJAXからこれらのリストの値にアクセスするにはどうしたらいいですか？私は警告を発すると私は未定義になる。

コントローラ

@ResponseBody 
@RequestMapping(value="/practice/{category}/option", method = RequestMethod.POST, produces = "application/json; charset=UTF-8") 
public List<Map<String, Object>> practicePageOption(@PathVariable("category") String category, @RequestParam("index") int index, ModelMap model, HttpSession session){ 

    //System.out.println(optionsList.get(index)); 
    //Result; 
    //[{word=abdomen, meaning=karın}, {word=search, meaning=aramak}, {word=fund, meaning=kurmak}, {word=surgeon, meaning=cerrah}, {word=various, meaning=çeşitli}] 
    return optionsList.get(index); 
} 

AJAX：

$('#pass').click(function(event) { 
    var inputIndex = $('#index').val(); 
    $.ajax({ 
     type: "POST", 
     url: "${pageContext.request.contextPath}/practice/${category}", 
     async:false, 
     data: { index: inputIndex }, 
     success: function(data){ 
      $('#label').text(data); 
      $.ajax({ 
       type: "POST", 
       url: "${pageContext.request.contextPath}/practice/${category}/option", 
       async:false, 
       contentType:"application/json; charset=utf-8", 
       dataType:"json", 
       data: { index: inputIndex }, 
       complete: function (data) { 
        //how can use data value 
        $('#optionA').text(data[0]); 
        alert(data[0]); //undefined 
       } 
      }); 
     } 
    }); 
}); 

Answer 1

あなたの問題はあなたのJavaScriptです。 2番目のajaxリクエストでは、の代わりにの完全なプロパティを使用します。完全なプロパティで指定された関数は、次のようなシグネチャを持つ必要があります。Function（jqXHR jqXHR、String textStatus）jsonリストの代わりに、jquery XHR objectを受け取っているので、data [0]は未定義です。あなたがあなたのリストを望むなら、あなたはこのようにそれを取得する必要があります：私はあなたがVAR inputIndex = $（「＃インデックス」）と、フォーム上の値にアクセスしている参照

var myList = JSON.parse(jqXHR.responseText); 
alert(myList[0]);