# Can make ui\_gauge clickable?

**URL:** https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171
**Category:** Dashboard
**Tags:** node-red-dashboard, function-node
**Created:** [14 February 2023 11:31 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171 "2023-02-14T11:31:16Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![khunakon](https://avatars.discourse-cdn.com/v4/letter/k/3da27b/32.png) [@khunakon](https://discourse.nodered.org/u/khunakon)
#### Post date: [14 February 2023 11:31 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/1 "2023-02-14T11:31:17Z")

</div>

Can make ui\_gauge clickable?

---

<div class="post-metadata">

### Author: ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)
#### Post date: [14 February 2023 19:30 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/2 "2023-02-14T19:30:02Z")

</div>

no it isn't. There are no plans to do that.

---

<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: [14 February 2023 19:53 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/3 "2023-02-14T19:53:05Z")

</div>

It is technically possible to add click handlers to any element on dashboard but I'd like to know why a gauge should be clickable cos if there is any adequate reason, probably it would be a standard behavior of the gauge.

---

<div class="post-metadata">

### Author: ![khunakon](https://avatars.discourse-cdn.com/v4/letter/k/3da27b/32.png) [@khunakon](https://discourse.nodered.org/u/khunakon)
#### Post date: [15 February 2023 00:57 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/4 "2023-02-15T00:57:21Z")

</div>

in my opinion , I created some project to be use in my family ,so my uncle get trouble about his eyes . i think about Clicking on gauge can be useful prefer to press button.

---

<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: [15 February 2023 07:08 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/5 "2023-02-15T07:08:41Z")

</div>

So with the `ui_template` node

```auto
<script>
    (function(scope) { 
        
        const addListeners = function(){
            let clickables = $('.clickable')
            for(let i = 0;i<clickables.length;++i){
                clickables[i].addEventListener('click',(evt) => {
                    scope.send({payload:evt.currentTarget.getAttribute('node-id'),topic:'dashboard-element-clicked'})
                })
            }
        }

        setTimeout(addListeners,100)

    })(scope);
</script>

```

Then add `.clickable` class to all elements which you wont to be clickable.  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/3/93dff21889eb20b09c407de0bebacc9b8fb64b5d.png)

And the output of the `ui_template` will give the id of the clicked node  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/2/023d8acf479683d129b0b585e3d705cfe83caeee.png)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/0/a0b361bf79e543a0bcb58519701c59dfb5eba49b.png)

And then at server side you'll need to make some kind of logic which bounds node's id's with the data you need

---

<div class="post-metadata">

### Author: ![khunakon](https://avatars.discourse-cdn.com/v4/letter/k/3da27b/32.png) [@khunakon](https://discourse.nodered.org/u/khunakon)
#### Post date: [16 February 2023 02:07 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/7 "2023-02-16T02:07:09Z")

</div>

Thank you so much i appreciate you !

---

<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: [2 March 2023 02:08 UTC](https://discourse.nodered.org/t/can-make-ui-gauge-clickable/75171/8 "2023-03-02T02:08:09Z")

</div>

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