2017-02-15 64 views
1

我能夠在html表中的單個標記中顯示api響應。但是,我試圖在表中添加另一段響應。我已經打牆...Ajax api調用表人口

$.ajax({ 
type: 'GET', 
url: "api query url", 
auth: "user:password", 
dataType: "json", 
crossDomain: true, 
success: function(data) { 
var list = data.list; 
$.each(list, function(i, item) { 
var tr = $('<tr>').append($('<td>').text(item.name)); 

這是我卡住...

$('<tr>').append($('<td>').text(item.playerStatus)); 
$("#scalaapi").append(tr); 
}); 
} 
}) 

這裏是JSON響應的樣本...

{ 
"list": [ 
    { 
     "id": 30, 
     "name": "Scala_Test Player", 
     "playerStatus": "Active", 
     "uuid": "f5672f69-be76-4057-8a46-68fa4ba9dda8", 
     "previewPlayer": false, 
     "enabled": true, 
     "mac": "00-00-00-00-00-00", 
     "type": "CHROMEBOX", 
     "distributionServer": { 
      "id": 2, 
      "name": "Main", 
      "driver": "IP_P2P" 
     }, 
    } 
} 

而且HTML ...

<section class="reports"> 
<div id="output"> 
    <table id="scalaapi"> 
    <tbody> 
    <tr><td></td><td></td></tr> 
    </tbody> 
    </table> 
</div> 
</section> 

回答

1

那是因爲你正在初始化循環中的變量tr。因此,它爲其分配新的價值並擦除舊的價值。在每個循環外聲明它。

請嘗試以下

$.each(val, function(i, item) { 

     tr = $('<tr>').append('<td>' + (item.name) + '</td>' + 
          '<td>' + (item.playerStatus) + '</td>'); 

     $("#scalaapi").append(tr); 
    }); 

這裏是鏈接JSBin

+0

你能解釋一下如何做到這一點? – KevMoe

+0

@KevMoe請嘗試新的答案。 – DevelopmentIsMyPassion

+0

謝謝......雖然這並不能解決我用playerStatus填充第二個​​的問題。 – KevMoe