# How does injecting {{msg.payload}} tag works in HTML?

**URL:** <https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025>\
**Category:** General\
**Created:** [4 August 2022 16:44 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025 "2022-08-04T16:44:08Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Wilay](https://avatars.discourse-cdn.com/v4/letter/w/54ee81/32.png) [@Wilay](https://discourse.nodered.org/u/Wilay)\
**Post date:** [4 August 2022 16:44 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/1 "2022-08-04T16:44:08Z")

</div>

It feels like sometimes it works, sometime it doesn't, and sometimes it breaks. My template node goes like this :

```auto
<div id = '{{msg.name}}' style = 'background-image : url("/{{msg.background}}") !important;'>
        <div onclick="window.open({{msg.url}}, '_blank')" style = "background-color : {{msg.payload}};">
            <h3>{{msg.name}}</h3>
            <p>{{msg.topic}}</p>
        </div>
    </div>

```

Everything works other than the window.open, no matter how I try to write it. I always find myself trying out every combination possible, with or without curly brackets, with or without quotation marks, etc, until I find the one that works, don't know why the results seem so inconsistent.

Does anyone know what I'm doing poorly here?

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [4 August 2022 16:53 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/2 "2022-08-04T16:53:01Z")

</div>

> [@Wilay](#):
>
> Everything works other than the window.open

`window.open` expects a string (put quotes around it)

```auto
window.open('{{msg.url}}', '_blank')

```

---

<div class="post-metadata">

**Author:** ![Wilay](https://avatars.discourse-cdn.com/v4/letter/w/54ee81/32.png) [@Wilay](https://discourse.nodered.org/u/Wilay)\
**Post date:** [4 August 2022 17:02 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/3 "2022-08-04T17:02:47Z")

</div>

Sorry I wasn't very clear!

I've tried to put quotes around it, and it simply breaks everything. My entire DIV seems to break when I change it to quotes, and the link doesn't work appropriately either.

```auto
<div onclick="window.open('{{msg.url}}', '_blank')" id = '{{msg.name}}' style = 'background-image : url("/{{msg.background}}") !important;'>

```

The moment I add the quotation marks, the UI breaks and every other tags show as {{msg.name}} and {{msg.background}} instead of the value they hold. Without trying to parse the msg.url, everything works perfectly.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [4 August 2022 17:20 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/4 "2022-08-04T17:20:36Z")

</div>

you will have to show us what is in `msg.url` - it may not be escaped and causing HTML issues.

A better solution would be to attach the on click hander in script or add use an anchor `<a href="{{msg.url}}" target="_blank"></a>`

Also, please be clear on the type of template. an orange template or the UI-template?

---

<div class="post-metadata">

**Author:** ![Wilay](https://avatars.discourse-cdn.com/v4/letter/w/54ee81/32.png) [@Wilay](https://discourse.nodered.org/u/Wilay)\
**Post date:** [4 August 2022 17:23 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/5 "2022-08-04T17:23:02Z")

</div>

My apologies, I am new to Node-RED and didn't know about the orange template : I'm using the UI-template node.

The msg.url is a string set to `https://www.google.com/`

---

<div class="post-metadata">

**Author:** ![Wilay](https://avatars.discourse-cdn.com/v4/letter/w/54ee81/32.png) [@Wilay](https://discourse.nodered.org/u/Wilay)\
**Post date:** [4 August 2022 17:37 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/6 "2022-08-04T17:37:50Z")

</div>

For the record, I did just decide to switch to an anchor, out of frustration. I'm just too curious as to why sometimes the msg. values don't get parsed properly, as it's been a problem I've been having many times.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [3 October 2022 17:37 UTC](https://discourse.nodered.org/t/how-does-injecting-msg-payload-tag-works-in-html/66025/7 "2022-10-03T17:37:58Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.