# How to check for gauge clicks

**URL:** https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562
**Category:** Dashboard
**Created:** [7 June 2022 10:59 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562 "2022-06-07T10:59:48Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![HuOliveiraWork](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/huoliveirawork/32/62521_2.png) [@HuOliveiraWork](https://discourse.nodered.org/u/HuOliveiraWork)
#### Post date: [7 June 2022 10:59 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/1 "2022-06-07T10:59:48Z")

</div>

Hello ereryone!

I have a project with a list of gauges and I need to detect the individual click of each of them. I don't know the best way to do this, nor do I know if there is a library that will help me with this situation.

This is my individual gauge configuration:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/f/df19c98efb1e702f58fd6aa4682477874fd58c4c.png)

Can anyone help me?

Thanks in advance!

---

<div class="post-metadata">

### Author: ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [7 June 2022 16:54 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/2 "2022-06-07T16:54:08Z")

</div>

As you see, the gauge node has no output. So there is no way to get any kind of feedback when you do click on the gauge.

---

<div class="post-metadata">

### Author: ![HuOliveiraWork](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/huoliveirawork/32/62521_2.png) [@HuOliveiraWork](https://discourse.nodered.org/u/HuOliveiraWork)
#### Post date: [8 June 2022 15:44 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/3 "2022-06-08T15:44:26Z")

</div>

Thanks for the reply!

Does that mean there is no way to do click management in javascript being like that?

So my only solution in this case is to add a button to each of my gauges?

---

<div class="post-metadata">

### Author: ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [8 June 2022 17:08 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/4 "2022-06-08T17:08:07Z")

</div>

There is of course way to add click handler to any element on your dashboard but it really depends on too many things so I can't give fully working solution or any better advise.

But if you can figure out the technique from this example - you may be get closer to your goal.

```auto
[{"id":"60121bbf4de72aee","type":"ui_gauge","z":"9141c3fbcc7d9e2b","name":"","group":"f6124e036e2d2ffb","order":14,"width":"2","height":"2","gtype":"gage","title":"gauge 1","label":"units","format":"{{value}}","min":0,"max":10,"colors":["#00b500","#e6e600","#ca3838"],"seg1":"","seg2":"","className":"gauge-clickable","x":380,"y":1400,"wires":[]},{"id":"dfbf8667ded5e478","type":"ui_gauge","z":"9141c3fbcc7d9e2b","name":"","group":"f6124e036e2d2ffb","order":14,"width":"2","height":"2","gtype":"gage","title":"gauge 2","label":"units","format":"{{value}}","min":0,"max":10,"colors":["#00b500","#e6e600","#ca3838"],"seg1":"","seg2":"","className":"gauge-clickable","x":380,"y":1440,"wires":[]},{"id":"fd313c3c6dde471f","type":"ui_template","z":"9141c3fbcc7d9e2b","group":"f6124e036e2d2ffb","name":"gauge's clickhandler","order":16,"width":0,"height":0,"format":"<script>\n (function(scope) {\n setTimeout(init,500)\n function init(){\n let gauges = document.querySelectorAll(\".gauge-clickable\") \n Array.from(gauges, (gauge) => { \n gauge.addEventListener(\"click\", function(e) { \n scope.send({payload:$(gauge).children('p').first().text()})\n })\n })\n }\n \n})(scope);\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","className":"","x":420,"y":1540,"wires":[["a99fe1fa59345834"]]},{"id":"a99fe1fa59345834","type":"debug","z":"9141c3fbcc7d9e2b","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":630,"y":1540,"wires":[]},{"id":"ef025df640d76f1d","type":"ui_gauge","z":"9141c3fbcc7d9e2b","name":"","group":"f6124e036e2d2ffb","order":14,"width":"2","height":"2","gtype":"gage","title":"gauge 5","label":"units","format":"{{value}}","min":0,"max":10,"colors":["#00b500","#e6e600","#ca3838"],"seg1":"","seg2":"","className":"gauge-clickable","x":380,"y":1480,"wires":[]},{"id":"f6124e036e2d2ffb","type":"ui_group","name":"Default","tab":"34ab7d39f3e308fc","order":1,"disp":true,"width":"5","collapse":false,"className":""},{"id":"34ab7d39f3e308fc","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

### Author: ![HuOliveiraWork](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/huoliveirawork/32/62521_2.png) [@HuOliveiraWork](https://discourse.nodered.org/u/HuOliveiraWork)
#### Post date: [8 June 2022 17:50 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/5 "2022-06-08T17:50:30Z")

</div>

Ohh nice example. I think I can handle it from here now.

Thanks for the help!

---

<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: [22 June 2022 17:51 UTC](https://discourse.nodered.org/t/how-to-check-for-gauge-clicks/63562/6 "2022-06-22T17:51:23Z")

</div>

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