Ajax-jqueryは表を作成するためにコールを受け取ります

Question

idを含むURLからweb serviceコールを取得しようとしています。 URLはhttp://10.173.143.252:8181/cxf/crm/customerservice/customers/125です。

urlはJSONレスポンスを送り返し

{"id":125,"name":"John","password":"password","role":"user","privileges":["SMPP Balance Enquiry","Trigger SMPP Notification"],"status":"active"} 

私のAjax jQueryのコードは次のとおりです。私のアプローチは私に適切に見える

<table class="table table-hover" id="personDataTable"> 
    <tr> 
     <th>id</th> 
     <th>name</th> 
     <th>password</th> 
     <th>role</th> 
     <th>privileges</th> 
     <th>status</th> 
    </tr> 
</table> 

：

$(document).ready(function() { 
    jQuery.support.cors = true; 

    $.ajax(
    { 
     type: "GET", 
     url: "http://10.173.143.252:8181/cxf/crm/customerservice/customers/125", 
     data: "{}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     cache: false, 
     success: function (data) { 
       $.each(data, function() { 
        $("#personDataTable tbody").append("<tr>"+"<td>"+data.id+"</td>" 
           +"<td>"+data.name+"</td>" 
           +"<td>"+data.password+"</td>" 
           +"<td>"+data.role+"</td>" 
           +"<td>"+data.privileges+"</td>" 
           +"<td>"+data.status+"</td>" 
           +"</tr>") 

    //  trHTML += '<tr><td>' + data.id[i] + '</td><td>' + data.name[i] + '</td><td>' + data.password[i] + '</td><td>' + data.role[i] + '</td><td>' + data.privileges[i] + '</td><td>' + data.status[i] + '</td></tr>'; 
    }) 
}, 
    error: function (msg) { 

     alert(msg.responseText); 
     } 
    }); 
}); 

私のHTMLは次のようになります。 1つのリロードで同じデータの6行が表に移入される理由は何でしょうか。はい、私は多くの他のリンクをgoogleに行ってきました。

Answer 1

あなたが値を取得することができ、最初にこの

$.each(parsedData.id, function (i, item) { 

Answer 2

var data = { 
 
    "id": 125, 
 
    "name": "John", 
 
    "password": "password", 
 
    "role": "user", 
 
    "privileges": ["SMPP Balance Enquiry", "Trigger SMPP Notification"], 
 
    "status": "active" 
 
} 
 

 
for (var key in data) { 
 
    console.log(data[key]) 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="table table-hover" id="personDataTable"> 
 

 
    <tr> 
 
    <th>id</th> 
 
    <th>name</th> 
 
    <th>password</th> 
 
    <th>role</th> 
 
    <th>privileges</th> 
 
    <th>status</th> 
 

 
    </tr> 
 

 
</table>

で、このライン$.each(data.id, function (i, item) {を交換し

parsedData = JSON.parse(data); 

それを使用するためにJSONレスポンスを解析する必要がこのように