以一個JSON響應，並把它轉換成HTML表格

-1

利用一種稱爲Postman程序我都用得到下面的代碼的第一部分，$捲曲位：

<?php 

$curl = curl_init(); 

curl_setopt_array($curl, array(
CURLOPT_URL => "https://api.extensopro.com/machines/list? customerid=????&apikey=??????????????????????????????????????", 
CURLOPT_RETURNTRANSFER => true, 
CURLOPT_ENCODING => "", 
CURLOPT_MAXREDIRS => 10, 
CURLOPT_TIMEOUT => 30, 
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1, 
CURLOPT_CUSTOMREQUEST => "GET", 
CURLOPT_HTTPHEADER => array(
"authorization: AWS4-HMAC-SHA256 Credential=/20170322/us-east-1/execute-api/aws4_request, SignedHeaders=content-type;host;x-amz-date, Signature=38e3277546829fd58be65805df8832c51b6a865c9df7279e80c408bd3116587d", 
"cache-control: no-cache", 
"content-type: application/x-www-form-urlencoded", 
"postman-token: 4aafd978-bda3-88ef-0db2-326b91880549", 
"x-amz-date: 20170322T095504Z" 
), 
)); 

$response = curl_exec($curl); 
$err = curl_error($curl); 

curl_close($curl); 
?> 
<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
</head> 
<body> 
    <table border="1" cellpadding="8" cellspacing="0" id="cteTable"> 
    <tr> 
     <th>ID</th> 
     <th>MANUFACTURER</th> 
     <th>YEAR</th> 
    </tr> 
</table> 
<script type="text/javascript"> 

$(document).ready(function() { 
$.getJSON(url, 
function (json) { 
    var tr; 
    for (var i = 0; i < json.length; i++) { 
     tr = $('<tr/>'); 
     tr.append("<td>" + json[i].ID + "</td>"); 
     tr.append("<td>" + json[i].MANUFACTURER + "</td>"); 
     tr.append("<td>" + json[i].YEAR + "</td>"); 
     $('table').append(tr); 
    } 
    }); 
}); 
$('#cteTable').append(tr) 
</script> 
</body> 
</body> 
</html>

我知道這是不正確的，但我沒有任何編碼知識，上面的代碼是部分從這post也從這

郵遞員的反應顯示大約40個標題，我必須讓每個人都在上面的代碼爲th是工作還是我想要的？

下面是輸出：

if ($err) { 
echo "cURL Error #:" . $err; 
} else { 
echo $response; 
} 


{"DATA":[{"UNITS":8,"CONDITION":{"NAME":"","VALUE":""},"UNITTYPE":"Stations","IMPRESSIONS":205000000,"MANUFACTURER":"Heidelberg","MODEL":"SM 102","HASREFERENCE":true,"HASSIZE":1,"YEAR":1994,"REFERENCE":"8187","URL":"/Machines/Heidelberg/44715-50082/Heidelberg-SM-102-8.html","SIZE":{"HEIGHT":1020,"HASWIDTH":1,"WIDTH":720,"NAME":"720x","HASHEIGHT":1},"HASIMAGE":1,"STATUSES":[{"NAME":"In Production","ID":8}],"CATEGORY":"Press","IMAGE":{"ONERROR":"failover(this, { imagegeneratorid: '219610_60', onerror1 : 'https://s3-eu-west-1.amazonaws.com/presscity-thumbnails/18/60/x60_heidelberg-sm102-219610.jpg', onerror2: 'http://pdf.presscity.com/localStorage_s3.cfm?orgFile=18_6535fb358939919cb4a37ac9f013b895.jpg&filename=x60_Heidelberg-SM102-219610.jpg&size=60&host=api.extensopro.com&nPictureNo=219610&nMachineNo=44715'});","ID":219610,"SRC":"http://cdn.presscity.com/18/60/x60_heidelberg-sm102-219610.jpg"},"SPECIFICATIONWEBSITE":"","SUBCATEGORY":"Sheetfed","NAME":"Heidelberg SM 102 8","ID":44715,"AVAILABLILITY":"","HASYEAR":1,"HASPRICE":0,"SPECIFICATION":"Straight Machine No Perfecting\r\nStream Feeder, CPC 1-03, CP Tronic, Autoplate, Alcolor damping, Auto Ink roller wash, \r\nAuto Blanket Wash, Non-stop feeder & delivery, Preset Feeder, Diagonal Register, Powder Spray, \r\n"}],"INFO":{"RECORDCOUNT":1}}

所以我知道從服務器的輸出工作，我現在該如何去解析這個輸出，並將其放置到表我的網頁上，併爲上述問，我是否必須使用所有輸出的字段或只是我想要的字段？

來源

2017-03-23 Tony Hanks

請分享resonse。 –

請發佈您期待的回覆和回覆。如果您發現任何錯誤，請分享。 –

已添加從數據服務器獲得的$響應。我如何解析並進入表格？ –

HTML頁面和您用來從頁面主體填充表格的Javascript需要成爲同一HTML頁面的一部分。如果是這種情況，從你發佈的內容中不清楚。嘗試用您的PHP文件中的代碼替換您的<script>...</script> 代碼。

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Untitled Document</title> 
</head> 
    <body> 
     <table id="cteTable"> 
     <tr> 
      <th>Account Name</th> 
      <th>Advisor</th> 
      <th>Links</th> 
     </tr> 
    </table> 
<script type="text/javascript"> 

    $(document).ready(function() { 
$.getJSON(url, 
    function (json) { 
     var tr; 
     for (var i = 0; i < json.length; i++) { 
      tr = $('<tr/>'); 
      tr.append("<td>" + json[i].User_Name + "</td>"); 
      tr.append("<td>" + json[i].score + "</td>"); 
      tr.append("<td>" + json[i].team + "</td>"); 
      $('table').append(tr); 
     } 
     }); 
    }); 
    $('#cteTable').append(tr) 
</script> 
</body> 
</html>

來源

2017-03-24 00:06:41

試試這個jQuery的數據表https://datatables.net/

來源

2017-03-24 02:04:08 ampedo

以一個JSON響應，並把它轉換成HTML表格

回答

相關問題