My application relies on Angular for functionality.
In the database, I fetch data stored in an array with various elements such as:
$ordersall[$count] = array(
"orderID" => $looporders["orderID"],
"customerID" => $looporders["customerID"],
"customerName" => $customerName,
"orderDate" => $looporders["orderDate"],
"orderDeliveryDate" => $looporders["orderDeliveryDate"],
"orderStatus" => $looporders["orderStatus"],
"orderdetailID" => $row["orderdetailID"],
"productTitle" => $productTitle,
"productPrijs" => $productPrijs,
"aantal" => $row["orderdetailAantal"],
"extras" => "",
"extrasprice" => ""
);
I want to display this data for each ORDERID. For every ORDERID, I aim to showcase customerName, orderDate, and specific order details like products, prices, extras, etc. It's important to note that a single order ID (e.g., 5) may have multiple order details including different product names, prices, extras, and more.
To handle a singular order ID, here's how I've approached it:
Angular
app = angular.module('app', []);
app.controller("NavCtrl",function($scope,$http){
var serviceBase = 'api/';
$http.get(serviceBase + 'orderoverview/58').then(function (results) {
$scope.categories = results.data;
$scope.getTotal = function(){
var total = 0;
for(var i = 0; i < $scope.categories.length; i++){
var categories = $scope.categories[i];
total += (categories.productPrice * categories.orderdetailAantal);
if(categories.extra1 != "")
{
total += categories.extrasPrice;
}
}
return total;
}
});
});
HTML
<div class="col-md-3" ng-controller="NavCtrl">
<div class="sm-st clearfix">
<!--span class="sm-st-icon st-red"><i class="fa fa-check-square-o"></i></span-->
<div class="sm-st-info">
<i class="fa fa-square"></i>
<span>Sander Hofman</span>
<p>1 minute</p>
<ul>
<li ng-repeat= "p in categories" ng-hide="categories.extra1.length">
{{p.orderdetailAantal}} {{p.productTitle}} <br>
+ {{p.extra1}} {{p.extra2}} {{p.extra3}} {{p.extra4}}
</li>
<li class="divider"></li>
</ul>
<p class="totalprice">{{ getTotal() }} euro</p>
</div>
</div>
</div>
How can I accomplish having a list item in HTML for each orderID along with all its associated order details?
Example:
OrderID: 5
OrderDetail1: Product Title, Price, Quantity
OrderDetail2: Product Title, Price, Quantity
OrderDetail3: Product Title, Price, Quantity
OrderID6:
OrderDetail1: Product Title, Price, Quantity
JSON SAMPLE
[
{"orderID":4,"customerID":1,"customerName":"Sander Hofman","orderDate":"2015-04-20 09:49:06","orderDeliveryDate":"2015-04-20","orderStatus":"done","orderdetailID":2,"productTitle":"Sexy Teacher","productPrijs":4,"aantal":1,"extras":"","extrasprice":""},
{"orderID":5,"customerID":2,"customerName":"Jelle Hofman","orderDate":"2015-04-20 12:05:09","orderDeliveryDate":"2015-04-20","orderStatus":"prepare","orderdetailID":3,"productTitle":"The Coach","productPrijs":3,"aantal":1,"extras":"","extrasprice":""},
{"orderID":5,"customerID":2,"customerName":"Jelle Hofman","orderDate":"2015-04-20 12:05:09","orderDeliveryDate":"2015-04-20","orderStatus":"prepare","orderdetailID":4,"productTitle":"The Virgin","productPrijs":3.2,"aantal":1,"extras":"","extrasprice":""},
{"orderID":5,"customerID":2,"customerName":"Jelle Hofman","orderDate":"2015-04-20 12:05:09","orderDeliveryDate":"2015-04-20","orderStatus":"prepare","orderdetailID":5,"productTitle":"Sexy Teacher","productPrijs":4,"aantal":3,"extras":"","extrasprice":""},
{"orderID":22,"customerID":11,"customerName":"Tom Welslau","orderDate":"2015-04-20 14:15:12","orderDeliveryDate":"2015-04-20","orderStatus":"prepare","orderdetailID":22,"productTitle":"The Virgin","productPrijs":3.2,"aantal":1,"extras":"","extrasprice":""},
{"orderID":22,"customerID":11,"customerName":"Tom Welslau","orderDate":"2015-04-20 14:15:12","orderDeliveryDate":"2015-04-20","orderStatus":"prepare","orderdetailID":23,"productTitle":"The Virgin","productPrijs":3.2,"aantal":1,"extras":"","extrasprice":""}
]