How do I push multiple events to google analytics on page load? - google-analytics

Question

I'm attempting to do two pushes to the analytics datalayer when my ecommerce receipt page loads.
My issue is that I can only ever pick up one of the two events.
I'm outputting this on the receipt page:
<script>
function trackEcommerce() {
dataLayer.push({
'event': 'checkout',
'ecommerce': {
'checkout': {
'actionField': { 'step': 2 }
}
}
});
}
dataLayer.push({
'event' : 'purchaseEvent',
'ecommerce': {
'purchase': {
'actionField': {
'id': '#orderId',
'affiliation': 'Eldorado',
'revenue': '#OrderTotal.ToString("F", System.Globalization.CultureInfo.GetCultureInfo("en-GB"))',
'tax':'#VatTotal.ToString("F", System.Globalization.CultureInfo.GetCultureInfo("en-GB"))',
'shipping': '#ShippingFee.ToString("F", System.Globalization.CultureInfo.GetCultureInfo("en-GB"))'
},
'products': [
#foreach (var item in GetLoop("OrderLines"))
{
string productName = item.GetString("Ecom:Product.Name").Replace("\"", "").Trim();
string productNumber = item.GetString("Ecom:Product.Number");
double orderLineUnitPrice = item.GetDouble("Ecom:Order:OrderLine.UnitPrice.PriceWithoutVAT.Value");
int orderLineQuantity = item.GetInteger("Ecom:Order:OrderLine.Quantity");
string brand = item.GetString("Ecom:Product:Field.Brands.Value");
var DwProduct = ProductService.GetProductById(item.GetString("Ecom:Order:OrderLine.ProductID"), item.GetString("Ecom:Order:OrderLine.ProductVariantID"), item.GetString("Ecom:Product.LanguageID"));
string category = DwProduct.DefaultGroup == null ? "" : DwProduct.DefaultGroup.Name;
<text>{
'name': '#productName',
'id': '#productNumber',
'price': '#orderLineUnitPrice.ToString("F", System.Globalization.CultureInfo.GetCultureInfo("en-GB"))',
'brand': '#brand',
'category': '#category',
'quantity': #orderLineQuantity
},</text>
}
]
}
},
'eventCallback': trackEcommerce()
});
</script>
I've tried formatting this code in a variety of different ways. I've had the callback function call the second dataLayer push directly like:
'eventCallback': function () {
dataLayer.push({
'event': 'checkout',
'ecommerce': {
}
});
}
I've also attempted just outputting the two dataLayer pushes in succession with no eventCallback or other relation between the two pushes.

Answer 1

Most obvious thing is that you're using a function call trackEcommerce() instead of referencing a function like 'eventCallback': trackEcommerce
However, just using two plain consequent pushes should work fine and would be easier to debug.
dataLayer.push({ 'event': 'checkout', ... });
// ...
dataLayer.push({ 'event': 'purchaseEvent', ... })