PHP / MySQL / Jquery - Building associative array and outputing it using JQuery $.each - php

Question

I'm building a calendar (FullCalendar) that shows orders for each day and the items that were ordered when you click on an order. When $order_info is put into the $data array, it's missing certain rows of data, as shown below in the 4th code block down. I'm trying to figure out how to put the array together so that every description (key) that is supposed to be shown is paired with the correct quantity (value) and then iterated out using an $.each function in jquery.
The $desc & $qty variables are concatenated when I query them from my table so I'm using the explode function to separate their values.
foreach($sql_query as $row) {
$desc = array_map('trim', explode(',', $row['OlineDesc']));
$qty = array_map('trim', explode(',', $row['OlineQty']));
$order_info = array_combine($desc, $qty);
$data[] = array (
'start' => $row['OrderDate'],
'order_id' => $row['OrderID'],
'desc_qty' => $order_info
);
}
Printing out the array after the closing tag of the foreach:
echo "<pre>";
echo print_r($data);
echo "</pre>";
Output:
// Output when print_r($data)
[0] => Array
(
[start] => 2019-05-11 16:00:00
[order_id] => 2509
[description] => Time: 04:00PM
[desc_qty] => Array
(
[#4 Beef and Pizza Special] => 1
[6 Lbs Italian Beef] => 1
[**incl Brd + Au Jus] => 1
[**incl Sweet Peppers] => 1
[**incl Hot Giardiniera] => 1
[XL 18" Pizza] => 1
[SAUSAGE] => 1
)
)
If I use array_merge to join my arrays instead of array_combine, it merges all the keys and values together as all the keys first, then values... but it's at least showing every row as opposed to the limited # of rows:
$order_info = array_merge($desc, $qty);
// Output when print_r($order_info)
[desc_qty] => Array
(
[0] => #4 Beef and Pizza Special
[1] => 6 Lbs Italian Beef
[2] => **incl Brd + Au Jus
[3] => **incl Sweet Peppers
[4] => **incl Hot Giardiniera
[5] => XL 18" Pizza
[6] => SAUSAGE
[7] => XL 18" Pizza
[8] => XL 18" Pizza
[9] => 1
[10] => 1
[11] => 1
[12] => 1
[13] => 1
[14] => 1
[15] => 1
[16] => 1
[17] => 1
)
Then I'm using jquery that's bound to an onClick event to load the information into a div where key is the description of the item and the value is the quantity:
$.each( event.desc_qty, function( key, value ) {
document.getElementById("party_info").innerHTML += "<span class="+key+">" + key + "<span id='sum_"+key+"'>" + value + "</span></span>";
});
My codes current output:
#4 Beef and Pizza Special 1
6 Lbs Italian Beef 1
**incl Brd + Au Jus 1
**incl Sweet Peppers 1
**incl Hot Giardiniera 1
XL 18" Pizza 1
SAUSAGE 1
Expected output that I'm trying to achieve:
#4 Beef and Pizza Special 1
6 Lbs Italian Beef 1
**incl Brd + Au Jus 1
**incl Sweet Peppers 1
**incl Hot Giardiniera 1
XL 18" Pizza 1
SAUSAGE 1
XL 18" Pizza 1
XL 18" Pizza 1
Any help or direction would be much appreciated! Thanks!
EDIT:
This is my SQL query. I'm using 3 different tables to gather all my information where I match the ID's to pull the proper information.
SELECT a.OrderDate, a.OrderID, a.OrdCustName, a.OrdPhone, b.OtotOrder,
b.OtotTotal, c.OlineOrder, GROUP_CONCAT(c.OlineDesc SEPARATOR ',') as
'OlineDesc', GROUP_CONCAT(FLOOR(COALESCE(c.OlineQty,'1'))) as
'OlineQty'
FROM db.tbldeferredorders a, db.tbldeferredordtotals b,
db.tbldeferredordlines c
WHERE a.OrderID = b.OtotOrder AND a.OrderID = c.OlineOrder
AND a.OrderDate >= NOW() - INTERVAL 3 MONTH
GROUP BY a.OrderID
This query will pull the OlineDesc column into a concatenated string that looks like this. Each comma is from a separate row that I pull together based on a.OrderID. So for this particular row, the OrderID is '2536'.
'#4 Beef and Pizza Special,6 Lbs Italian Beef,**incl Brd + Au
Jus,**incl Sweet Peppers,**incl Hot Giardiniera,XL 18" Pizza,XL 18"
Pizza,SAUSAGE,XL 18" Pizza,PEPPERONI,Lrg Caesar Salad,** ceaser
dressing,Lg 3 Cheese Baked Penne'
The OlineQty column looks like this when I run the query:
'1,1,1,1,1,1,1,1,1,1,1,1,1'

Answer 1

It's probably not the most elegant solution but I found a way to solve my issue. I found that array_combine can't have duplicate keys, so instead of having just a single array, I decided on having 2. And since both arrays have an equal number of descriptions to quantities, I took the descriptions array and used an $.each loop to go through it, then I paired it with the qty[key] as it was going through each loop. This matched it line for line.
$.each( event.desc, function( key, value ) {
document.getElementById("party_info").innerHTML += "<span class="+value+">" + key + "<span id='sum_"+value+"'>" + event.qty[key] + "</span></span>";
});