通过AJAX结果循环并发布到HTML,

时间:2014-12-20 12:02:26

标签: mysql ajax for-loop

我有以下用于处理数据库返回结果的AJAX代码,

$.ajax({
  type: 'POST',
  async: true,
  url: "../../../avocado/private/functions/measures.php",
  data: {name:selectedValue},
  success: function(data, status){
      var selectedData = JSON.parse(data);
      console.log(selectedData);
      document.getElementById("measures").innerHTML    = "<div id=\"measures\">"
                                                       + "<table class=\"table table-condensed\">"
                                                       + "<tr><th>desc1</th><td>"+selectedData[0][6]+"</td></tr>"
                                                       + "<tr><th>desc2</th><td>"+selectedData[0][7]+"</td></tr>"
                                                       + "<tr><th>desc3</th><td>"+selectedData[0][8]+"</td></tr>"
                                                       + "<tr><th>desc4</th><td>"+selectedData[0][9]+"</td></tr>"
                                                       + "</table>"
                                                       + "</div>";

  },
  error: function(xhr, status, err) {
    alert(status + ": " + err);
  }
});

返回的数据是2D数组,如下所示

Array[5]
0: Array[14]
1: Array[14]
2: Array[14]
3: Array[14]
4: Array[14]

所以我想做的是循环每个数组并在HTML页面上显示内部信息,但我不知道我应该怎么做...这段代码只返回存储在index [0]上的值。

我能帮忙吗?

=============================================== ===============================

已更新

所以我尝试使用Jquery.append(),如下所示。

 jQuery.each( selectedData, function( i, val ) {
          $("measures").append(  
            "<table class=\"table table-condensed\">"
            + "<tr><th>desc1</th><td>"+selectedData[i][6]+"</td></tr>"
            + "<tr><th>desc2</th><td>"+selectedData[i][7]+"</td></tr>"
            + "<tr><th>desc3</th><td>"+selectedData[i][8]+"</td></tr>"
            + "<tr><th>desc4</th><td>"+selectedData[i][9]+"</td></tr>"
            + "</table>"
          );
       });
      /*
      document.getElementById("measures").innerHTML    = "<div id=\"measures\">"
                                                       + "<table class=\"table table-condensed\">"
                                                       + "<tr><th>desc1</th><td>"+selectedData[0][6]+"</td></tr>"
                                                       + "<tr><th>desc2</th><td>"+selectedData[0][7]+"</td></tr>"
                                                       + "<tr><th>desc3</th><td>"+selectedData[0][8]+"</td></tr>"
                                                       + "<tr><th>desc4</th><td>"+selectedData[0][9]+"</td></tr>"
                                                       + "</table>"
                                                       + "</div>";
        */

现在..不会将任何值附加到div#measures ...

1 个答案:

答案 0 :(得分:0)

我没有尝试过代码。但我希望这会对你有帮助。

document.getElementById("measures").innerHTML    = "<div id=\"measures\">";
$.each( selectedData, function( index, value ){
  $.each( index, function( index2, value2 ){
     $('#measures').append(value2);
  });  
});