Javascript 如何将JSON数组对象放入引导表？
我有一个JSON文件，应该在引导表中获得输出。我的JSON文件如下所示：Javascript 如何将JSON数组对象放入引导表？,javascript,html,jquery,ajax,twitter-bootstrap,Javascript,Html,Jquery,Ajax,Twitter Bootstrap,我有一个JSON文件，应该在引导表中获得输出。我的JSON文件如下所示： //your response var data = { "data": [{ "eventInfo": { "context": { "siteTimezone": "Asia/Brunei", "entityPk": "
//your response
var data = {
"data": [{
"eventInfo": {
"context": {
"siteTimezone": "Asia/Brunei",
"entityPk": "8802089762861",
"entityClass": "de.hybris.platform.core.model.order.OrderModel",
"com.amway.core.events.model.AmwayEventQueueEntryModel": "8805563195834"
},
"isoCountryCode": "BN",
"eventType": "ORDER_CONFIRMED",
"entityType": "salesorder",
"sourceTimestamp": "2020-06-25T14:05:56.683+08:00",
"sourceApplication": "HYBRIS",
"affiliateCode": "100",
"entityId": "7100029639",
"sourceEventId": "4521231e-c347-459b-8d46-43cd2010c8c1",
"accountId": "8055817",
"sourceHost": "ip-10-127-165-135.ap-southeast-1.compute.internal"
},
"entity": {
"lynxIsPCP": false,
"paymentRequired": true,
"bonusTransactionRequired": true,
"addresses": [{
"telephoneNumber": "03-7946 2800",
"isoCountryCode": "BN",
"line3": "Bandar Seri Begawan",
"cityName": "Brunei",
"line2": "Kampung Kiulap",
"line1": "6 & 7, Block A, Kompleks Shakirin",
"careOfName": "",
"state": "BR",
"emailAddress": "vhwzezgj@rzrcy.bmh",
"postalCode": "BE1518",
"id": "8804188225559"
},
{
"telephoneNumber": "5494492",
"isoCountryCode": "BN",
"line3": "GADONG",
"line4": "8171571",
"cityName": "BDR SERI BEGAWAN",
"line2": "KAMPONG RIMBA",
"line1": "5 SIMPANG 12-32",
"careOfName": "",
"state": "BR",
"emailAddress": "vhwzezgj@rzrcy.bmh",
"postalCode": "BE3119",
"id": "8802223521815"
},
{
"telephoneNumber": "5494492",
"isoCountryCode": "BN",
"line3": "GADONG",
"line4": "8171571",
"cityName": "BDR SERI BEGAWAN",
"line2": "KAMPONG RIMBA",
"line1": "5 SIMPANG 12-32",
"careOfName": "",
"state": "BR",
"emailAddress": "vhwzezgj@rzrcy.bmh",
"postalCode": "BE3119",
"id": "8802223521815"
},
{
"telephoneNumber": "03-7946 2800",
"isoCountryCode": "BN",
"line3": "Bandar Seri Begawan",
"cityName": "Brunei",
"line2": "Kampung Kiulap",
"line1": "6 & 7, Block A, Kompleks Shakirin",
"careOfName": "",
"state": "BR",
"emailAddress": "myhelpdesk@Amway.com",
"postalCode": "BE1518",
"id": "8800157073431"
}
],
"totalOrderValue": 147.5,
"lynxPaymentChangePaid": 0.0,
"lynxIsRepair": false,
"adjustments": [],
"requestedDeliveryServiceLevel": "walkin",
"lynxTenure": 0,
"saleCountryCode": "BN",
"orderDateTime": "2020-06-25T14:05:56.328+08:00",
"invoiceSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"userAgent": "Suresh Mathiarasu",
"orderStatus": "CONFIRMED",
"isoCurrencyCode": "BND",
"fees": [{
"feeCode": "walkin",
"feeTaxTotalAmount": 0.0,
"lynxRefunded": false,
"feeAmount": 0.0,
"feeTaxDetails": [{
"taxAmount": 0.0,
"taxCode": "BN_NO_SCOPE_VAT_SALES"
}]
}],
"bonusPeriod": "202006",
"orderingPartyId": "40986385",
"lynxPayerPartyId": "40986385",
"salesChannelCode": "Point of Sale",
"lynxIsEpp": false,
"lynxPayerPartyName": "ROHANA BINTI HJ LATIP",
"lynxDemandLocationName": "BN",
"lynxDeliveryType": "pis",
"paymentSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"orderPriceList": "AmwayDefaultABOPriceGroup",
"lynxVolumePartyId": "40986385",
"lynxHasSopEntries": false,
"orderLines": [{
"linePrice": 147.5,
"itemType": "AmwayVariantProduct",
"itemBV": 29.5,
"lynxBirTaxPerUnit": 0.0,
"lynxInvoiceNumber": "130099000",
"lynxLineAdjustedPV": 0.0,
"shippedQuantity": 0,
"lineStatus": "OPEN",
"lynxProductSerialNumber": [],
"lineUnitOfMeasure": "EA",
"allocatedQuantity": 5,
"linePVAmount": 95.0,
"lynxBmCode": [],
"lastUpdateDate": "2020-06-25T14:05:56.469+08:00",
"lynxBillingAddressReference": "8802223521815",
"cancelledQuantity": 0,
"lynxBaseItemId": "115383D",
"demandLocation": "T45",
"backorderedQuantity": 0,
"taxNotRequired": false,
"pickupAddressReference": "8804188225559",
"unallocatedQuantity": 0,
"pendingQuantity": 5,
"itemABOPrice": 29.5,
"lineTaxTotalAmount": 0.0,
"lynxIsSopLine": false,
"lynxWasBackorder": false,
"itemSuggestedRetailPrice": 37.0,
"lineTotalValue": 147.5,
"baseItemId": "115383D",
"lynxMasterCode": [],
"itemDescription": "ARTISTRY SIGNATURE COLOR Lipstick - Daring Red (06) (3.8g)",
"lineTaxDetails": [{
"taxAmount": 0.0,
"taxCode": "BN_NO_SCOPE_VAT_SALES"
}],
"shipAddressReference": "8804188225559",
"lynxPickupAddressName": "BN",
"lynxIsSopEntry": false,
"lynxBirAcknowledgementResetCounter": "1",
"lynxLineAdjustedBV": 0.0,
"orderedQuantity": 5,
"itemListPrice": 29.5,
"fulfillmentType": "walkin",
"returnedQuantity": 0,
"orderLineId": 0,
"itemPV": 19.0,
"lineBVAmount": 147.5
}],
"lynxFulfillmentAddressReference": "8800157073431",
"cashierBatchId": "amwaybrunei-AM-BN-BN-T45-MY020394-1593058911313",
"lynxOrderingPartyName": "ROHANA BINTI HJ LATIP",
"totalBVAmount": 147.5,
"lynxVolumeTransactions": [],
"volumeSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"taxDetails": [{
"taxAmount": 0.0,
"taxCode": "BN_NO_SCOPE_VAT_SALES"
}],
"lynxUserType": "AmwayBusinessNature_1",
"lynxPaymentTenderedAmount": 147.5,
"lynxVolumePartyName": "ROHANA BINTI HJ LATIP",
"lynxOrderCreatedBy": "MY020394",
"lynxOms": "Hybris",
"orderForSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"lynxPaymentInstalmentType": "PIF",
"lynxMemberPoints": 0.0,
"lynxContactPhone": "5494492",
"totalPVAmount": 95.0,
"inventoryTransactionRequired": true,
"lynxIsEventBooking": false,
"lynxBirCashierId": "MY020394",
"refunds": [],
"invoiceWithConsignmentRequired": false,
"orderPeriod": "202006",
"orderingSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"lynxContactEmailId": "vhwzezgj@rzrcy.bmh",
"amwaySalesEntity": "780",
"paymentStatus": "PAID",
"storefront": "amwaybrunei",
"lynxPaymentType": "PIF",
"salesOrderId": "7100029639",
"lynxOrderCategory": "selfOrder",
"payments": [{
"verificationDate": "2020-06-25T14:05:54.453+08:00",
"lynxIsConnectedFlow": false,
"paymentLocation": "T45",
"lynxPaymentProcessedBy": "8055817",
"paymentStatus": "ACCEPTED",
"terminalId": "MY020394",
"paymentReferenceId": "TXN-1593065154321",
"payerSalesAccount": {
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"paymentDate": "2020-06-25T14:05:54.456+08:00",
"isoCurrencyCode": "BND",
"lynxPaymentInformation": "",
"paymentId": "831122002_4e7c1945-b49d-4c86-a0b8-a05b0cb805fa",
"paymentValue": 147.5,
"paymentMethod": "cash",
"merchantId": "amway"
}],
"shipToSalesAccount": {
"lynxBusinessStyle": "ROHANA LATIP & WAN ROSLAN",
"accountId": "8055817",
"lynxPinLevel": "330",
"lynxName": "ROHANA BINTI HJ LATIP & WAN ROSLAN B WAN SU",
"affiliateCode": "100"
},
"totalABORetailProfit": 0.0,
"totalTaxAmount": 0.0,
"lynxOrderType": "NORMAL_ORDER",
"lynxComments": []
}
}
]
};
var order_data = ''
//looping under data->data
$.each(data.data, function(key, value) {
order_data += '<tr>';
//getting values
order_data += '<td>' + value.eventInfo.accountId + '</td>';
order_data += '<td>' + value.entity.salesOrderId + '</td>';
order_data += '<td>' + value.eventInfo.eventType + '</td>';
order_data += '<td>' + value.entity.orderDateTime + '</td>';
order_data += '<td>' + value.entity.orderStatus + '</td>';
order_data += '<td>' + value.entity.totalPVAmount + '</td>';
order_data += '<td>' + value.entity.totalBVAmount + '</td>';
order_data += '<td>' + value.entity.totalOrderValue + '</td>';
order_data += '</tr>';
})
$('#order_table>tbody').append(order_data);
如何在特定的引导表中获取每个对象的详细信息？任何提示或帮助都将不胜感激。从最近几天开始，我就一直在使用这些资源。每当我使用表和引导时，我都会使用这些资源来处理数据 顺便说一句，您正在将身体数据解析到表directy中，而不是解析到tbody标记中。 试试这个
$（'#order_table>tbody'）。追加（order_数据）；
//在脚本标记中使用它
$（文档）.ready（函数（）{
$.getJSON（“Order.json”），函数（数据）{
风险值顺序_数据=“”；
$。每个（数据、函数（键、值）{
订单数据+=''；
订单_数据+=''+值.ABONumber+''；
订单号数据+=''+值。订单号+''；
订单\数据+=''+值。订单类型+''；
订单数据+=''+值。订单日期+''；
订单数据+=''+值。订单状态+''；
订单数据+=''+值。总PV+''；
订单_数据+=''+值。总计BV+''；
订单数据+=''值。总金额+''；
订单数据+=''；
})
//更改此选择器！
$（'#order_table>tbody'）。追加（order_数据）；
});
});
数据.datavalue.eventInfo.accountId//您的回答
风险值数据={
“数据”：[{
“事件信息”：{
“背景”：{
“站点时区”：“亚洲/文莱”，
“entityPk”：“8802089762861”，
“entityClass”：“de.hybris.platform.core.model.order.OrderModel”，
“com.amway.core.events.model.AmwayEventQueueEntryModel”：“8805563195834”
},
“等CountryCode”：“BN”，
“事件类型”：“订单确认”，
“entityType”：“salesorder”，
“sourceTimestamp”：“2020-06-25T14:05:56.683+08:00”，
“sourceApplication”：“HYBRIS”，
“附属代码”：“100”，
“entityId”：“7100029639”，
“sourceEventId”：“4521231e-c347-459b-8d46-43cd2010c8c1”，
“accountId”：“8055817”，
“源主机”：“ip-10-127-165-135.ap-东南-1.compute.internal”
},
“实体”：{
“lynxIsPCP”：错误，
“paymentRequired”：正确，
“BonuTransactionRequired”：true，
“地址”：[{
“电话号码”：“03-7946 2800”，
“等CountryCode”：“BN”，
“第三行”：“斯里巴加湾班达尔”，
“城市名称”：“文莱”，
“第二行”：“Kampung Kiulap”，
“第1行”：“Kompleks Shakirin A区6号和7号”，
“careOfName”：“，
“状态”：“BR”，
“电子邮件地址”：”vhwzezgj@rzrcy.bmh",
“postalCode”：“BE1518”，
“id”：“880418822559”
},
{
“电话号码”：“5494492”，
“等CountryCode”：“BN”，
“第三行”：“嘎东”，
“第4行”：“8171571”，
“城市名称”：“巴西第纳尔塞里巴加湾”，
“第二行”：“磅临巴”，
“第1行”：“5 SIMPANG 12-32”，
“careOfName”：“，
“状态”：“BR”，
“电子邮件地址”：”vhwzezgj@rzrcy.bmh",
“postalCode”：“BE3119”，
“id”：“880223521815”
},
{
“电话号码”：“5494492”，
“等CountryCode”：“BN”，
“第三行”：“嘎东”，
“第4行”：“8171571”，
“城市名称”：“巴西第纳尔塞里巴加湾”，
“第二行”：“磅临巴”，
“第1行”：“5 SIMPANG 12-32”，
“careOfName”：“，
“状态”：“BR”，
“电子邮件地址”：”vhwzezgj@rzrcy.bmh",
“postalCode”：“BE3119”，
“id”：“880223521815”
},
{
“电话号码”：“03-7946 2800”，
“等CountryCode”：“BN”，
“第三行”：“斯里巴加湾班达尔”，
“城市名称”：“文莱”，
“第二行”：“Kampung Kiulap”，
“第1行”：“Kompleks Shakirin A区6号和7号”，
“careOfName”：“，
“状态”：“BR”，
“电子邮件地址”：”myhelpdesk@Amway.com",
“postalCode”：“BE1518”，
“id”：“8800157073431”
}
],
“totalOrderValue”：147.5，
“lynxPaymentChangePaid”：0.0，
“修复”：错误，
“调整”：[…]，
“requestedDeliveryServiceLevel”：“walkin”，
“lynxTenure”：0，
“国家代码”：“BN”，
“订单日期时间”：“2020-06-25T14:05:56.328+08:00”，
“发票销售帐户”：{
“LynxBusiness Style”：“ROHANA LATIP&WAN ROSLAN”，
“accountId”：“8055817”，
“lynxPinLevel”：“330”，
“lynxName”：“ROHANA BINTI HJ LATIP&WAN ROSLAN B WAN SU”，
“附属代码”：“100”
},
“用户代理”：“Suresh Mathiaasu”，
“订单状态”：“已确认”，
“等电流代码”：“BND”，
“费用”：[{
“feeCode”：“walkin”，
“feeTaxTotalAmount”：0.0，
“lynxRefunded”：false，
“费额”：0.0，
“详细信息”：[{
“税额”：0.0，
“税号”：“BN\u无范围\u增值税\u销售”
}]
}],
“BonuPeriod”：“202006”，
“orderingPartyId”：“40986385”，
“lynxPayerPartyId”：“40986385”，
“salesChannelCode”：“销售点”，
“lynxIsEpp”：错，
“lynxPayerPartyName”：“ROHANA BINTI HJ LATIP”，
“lynxDemandLocationName”：“BN”，
“lynxDeliveryType”：“pis”，
“paymentSalesAccount”：{
“LynxBusiness Style”：“ROHANA LATIP&WAN ROSLAN”，
“accountId”：“8055817”，
“lynxPinLevel”：“330”，
“lynxName”：“ROHANA BINTI HJ LATIP&WAN ROSLAN B WAN SU”，
“附属代码”：“100”
},
“orderPriceList”：“AmwayDefaultAboPricelGroup”，
“lynxVolumePartyId”：“40986385”，
“LynxhassOpenTrys”：错误，
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v4.0.1">
<title>Amway Order Entry</title>
<link rel="canonical" href="https://getbootstrap.com/docs/4.5/examples/checkout/">
<!-- Bootstrap core CSS -->
<link href="assets/dist/css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="form-validation.css" rel="stylesheet">
<style>
.inline-button {
width: 48%;
display: inline;
margin-top: 32px;
}
</style>
</head>
<body class="bg-light">
<div class="container-fluid px-5">
<div class="row">
<div class="col-12 mt-5">
<h4 class="mb-3">Order Enquiry</h4>
<form class="needs-validation" novalidate>
<div class="row">
<div class="col-2">
<label for="firstName">Country</label>
<select class="form-control" id="country" >
<option value="">Choose</option>
<option value="IN">Malaysia</option>
<option value="US">Vietnam</option>
<option value="US">Philippines</option>
<option value="US">Japan</option>
</select>
<div class="invalid-feedback">
Valid country required.
</div>
</div>
<div class="col-2">
<label for="firstName">Order Type</label>
<select class="form-control" id="country" >
<option value="">Choose</option>
<option value="IN">Sales Order</option>
<option value="US">Sales Return</option>
</select>
</div>
<div class="col-2">
<label for="lastName">Order No.</label>
<input type="text" class="form-control" id="order" placeholder="" value="" >
<div class="invalid-feedback">
Valid Order No. is required.
</div>
</div>
<div class="col-2">
<label for="lastName">From Date</label>
<input type="date" class="form-control" id="from-date" placeholder="" value="" >
<div class="invalid-feedback">
Valid From Date is required.
</div>
</div>
<div class="col-2">
<label for="lastName">To Date</label>
<input type="date" class="form-control" id="to-date" placeholder="" value="" >
<div class="invalid-feedback">
Valid To Date is required.
</div>
</div>
<div class="col-1"> </div>
<div class="col-2">
<label for="lastName">ABO NO</label>
<input type="text" class="form-control" id="abo" placeholder="" value="" >
<div class="invalid-feedback">
Valid ABO is required.
</div>
</div>
<div class="col-3">
<label for="firstName">Account Type</label>
<select class="form-control" id="account" >
<option value="">Choose</option>
<option value="PSA">Payment Sales Account</option>
<option value="CA">Volume Sales Account</option>
<option value="CA">Invoice Sales Account</option>
<option value="CA">Ship to Sales Account</option>
<option value="CA">Ordering Sales Account</option>
<option value="CA">Order to Sales Account</option>
</select>
<div class="invalid-feedback">
Valid Account Type required.
</div>
</div>
<div class="col-0"></div>
<div class="col-2">
<button class="btn btn-primary inline-button" type="submit">Search</button>
<button class="btn btn-secondary inline-button" type="reset">Reset</button>
</div>
<div class="col-5"></div>
<p> </p>
<hr class="mb-4">
<div class="container-fluid">
<h4>Results :</h4>
<table class="table table-striped" id="order_table">
<thead>
<tr>
<th>ABONumber</th>
<th>OrderNumber</th>
<th>OrderType</th>
<th>OrderDate</th>
<th>OrderStatus</th>
<th>TotalPV</th>
<th>TotalBV</th>
<th>TotalAmount</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="../assets/js/vendor/jquery.slim.min.js"><\/script>')</script>
<script src="form-validation.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
</html>
$('#order_table>tbody').append(order_data);
//use it in your script-tag
<script>
$(document).ready(function(){
$.getJSON("Order.json",function(data){
var order_data='';
$.each(data,function(key,value){
order_data +='<tr>';
order_data += '<td>'+value.ABONumber+ '</td>';
order_data += '<td>'+value.OrderNumber+ '</td>';
order_data += '<td>'+value.OrderType+ '</td>';
order_data += '<td>'+value.OrderDate+ '</td>';
order_data += '<td>'+value.OrderStatus+ '</td>';
order_data += '<td>'+value.TotalPV+ '</td>';
order_data += '<td>'+value.TotalBV+ '</td>';
order_data += '<td>'+value.TotalAmount+ '</td>';
order_data += '</tr>';
})
// change this selector!
$('#order_table>tbody').append(order_data);
});
});
</script>
const itemTemplates = [];
for (const i of items) {
itemTemplates.push(html`<li>${i}</li>`);
}
html`
<ul>
${itemTemplates}
</ul>
`;