# Change Dashboard side on click on image

**URL:** <https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912>\
**Category:** Dashboard\
**Created:** [19 June 2018 08:21 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912 "2018-06-19T08:21:24Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![bk1989](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bk1989/32/2826_2.png) [@bk1989](https://discourse.nodered.org/u/bk1989)\
**Post date:** [19 June 2018 08:21 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912/1 "2018-06-19T08:21:24Z")

</div>

So I managed to show an image on the dashboard using a template node andnthe following code

```
<div height="200" style="height: 200px;">
<img src="/Block_Gray.png" width="140"><br/>
</div>

```

Now I want to send a number to a ui control node, when the image is clicked. I already tried the following line

`<a href="" class="off" onclick="this.className='on';return false;">Foo</a>`  
Does somebody have a hint for me?

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [19 June 2018 08:22 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912/2 "2018-06-19T08:22:37Z")

</div>

The hint you need is the ‘Sending a message’ section of the `ui_template` node’s help in the Info sidebar.

---

<div class="post-metadata">

**Author:** ![bk1989](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bk1989/32/2826_2.png) [@bk1989](https://discourse.nodered.org/u/bk1989)\
**Post date:** [19 June 2018 08:58 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912/3 "2018-06-19T08:58:32Z")

</div>

I saw the Sending a message section, but this creates an extra button under the image, that needs to be clicked. I don’t want to creat a button, I wnat to capture if the image is clicked.

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [19 June 2018 09:12 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912/4 "2018-06-19T09:12:49Z")

</div>

Understood, but the principle is the same. That section shows how to trigger a message when _something_ happens using the `ng-click` attribute.

Applying that to your `<div>`…

```auto
<div height="200" style="height: 200px;" ng-click="send({payload:'clicked'});">
<img src="/Block_Gray.png" width="140"><br/>
</div>

```

---

<div class="post-metadata">

**Author:** ![bk1989](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bk1989/32/2826_2.png) [@bk1989](https://discourse.nodered.org/u/bk1989)\
**Post date:** [19 June 2018 10:28 UTC](https://discourse.nodered.org/t/change-dashboard-side-on-click-on-image/912/5 "2018-06-19T10:28:00Z")

</div>

Thanks, worked for me