How should I structure dot notation to pull specific value item (totalPrice) on GTM?

46 views Asked by At

I want to pull a specific value which is 'totalPrice' and setup a variable on GTM. However, I couldn't manage to pull that value yet.

when I use document.querySelector('.flashMeta') on the browser console I manage to see all the data below

document.querySelector('.flashMeta');

<input type=​"hidden" value=​"{"name":​"testorder-3011","items":​[{"id":​1178,"order_id":​954,"product_id":​"org.jancy.io.pcap","quantity":​1,"price":​10,"_product":​{"name":​"Network Packet Capturing","description":​"Required for capturing network packets via Pcap","price":​10,"stripeProductId":​"prod_JRMaWpolrESBba","stripeTestPriceId":​"price_1JV8ulHspypOLDR1DJDkkWbK","stripeLivePriceId":​"price_1JV9ftHspypOLDR1FVUzmurI","plugins":​["pcap-sniffer","tcp-flow-monitor","udp-flow-monitor"]​,"id":​"org.jancy.io.pcap","isCapability":​true,"url":​"/​account/​capabilities/​org.jancy.io.pcap"}​}​,{"id":​1179,"order_id":​954,"product_id":​"org.jancy.io.websocket","quantity":​1,"price":​30,"_product":​{"name":​"WebSockets","description":​"Required for establishing WebSocket connections","price":​30,"stripeProductId":​"prod_JRMf513897pF8t","stripeTestPriceId":​"price_1JV8OLHspypOLDR10KjBKVD2","stripeLivePriceId":​"price_1JV9g2HspypOLDR1mnl7zBGA","plugins":​["websocket-client","websocket-server"]​,"id":​"org.jancy.io.websocket","isCapability":​true,"url":​"/​account/​capabilities/​org.jancy.io.websocket"}​}​]​,"totalPrice":​0}​" class=​"flashMeta">​

All I want is to pull 'totalPrice' value dynamically and set it up on GTM.

1

There are 1 answers

1
gvmani On

Storing and retrieving the data from hidden fields may not be the best option. None the less, you need to stringify the object before storing it as value, so that it can be be parsed back and used.

//let data = JSON.parse(document.querySelector('.flashMeta').value);
let data = {"name":"testorder-3011","items":[{"id":"1178","order_id":"954","product_id":"org.jancy.io.pcap","quantity":"1","price":"10","_product":{"name":"Network Packet Capturing","description":"Required for capturing network packets via Pcap","price":"10","stripeProductId":"prod_JRMaWpolrESBba","stripeTestPriceId":"price_1JV8ulHspypOLDR1DJDkkWbK","stripeLivePriceId":"price_1JV9ftHspypOLDR1FVUzmurI","plugins":["pcap-sniffer","tcp-flow-monitor","udp-flow-monitor"],"id":"org.jancy.io.pcap","isCapability":"true","url":"/account/capabilities/org.jancy.io.pcap"}},{"id":"1179","order_id":"954","product_id":"org.jancy.io.websocket","quantity":"1","price":"30","_product":{"name":"WebSockets","description":"Required for establishing WebSocket connections","price":"30","stripeProductId":"prod_JRMf513897pF8t","stripeTestPriceId":"price_1JV8OLHspypOLDR10KjBKVD2","stripeLivePriceId":"price_1JV9g2HspypOLDR1mnl7zBGA","plugins":["websocket-client","websocket-server"],"id":"org.jancy.io.websocket","isCapability":"true","url":"/account/capabilities/org.jancy.io.websocket"}}],"totalPrice":"0"}

document.querySelector('.flashMeta').value = JSON.stringify(data);


console.log(JSON.parse(document.querySelector('.flashMeta').value).totalPrice);
console.log("Done");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
<input type="hidden" value="" class="flashMeta">
</body>