# UI Button - momentary function

**URL:** <https://discourse.nodered.org/t/ui-button-momentary-function/18894>\
**Category:** Dashboard\
**Created:** [8 December 2019 07:16 UTC](https://discourse.nodered.org/t/ui-button-momentary-function/18894 "2019-12-08T07:16:36Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)\
**Post date:** [8 December 2019 07:16 UTC](https://discourse.nodered.org/t/ui-button-momentary-function/18894/1 "2019-12-08T07:16:36Z")

</div>

Hello, just thought I should suggest a feature to be added to the UI Button. Currently you can configure the message to be sent when the button is clicked (pressed DOWN).

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

I see several use cases where a momentary function is needed. So what if there was a possible setting for "When released, send:" as well? If filled in it will be sent

Right know I have a solution based on a UI Template with code borrowed & provided by other users on the board but I think it would be better to have this feature as standard, available in the UI Button itself

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/7/7221d60e596078bab8a8cf820666769fca1c8cd1.png)

```auto
<div class="momentary">
   <md-button> R1 ON/OFF</md-button>
</div>

<script>

(function($scope) {
    
$('.momentary').on('touchstart mousedown', function(e) {
    e.preventDefault(); //prevent default behavior
    $scope.send({"payload": "R1_ON,127.0.0.1"});
});

$('.momentary').on('touchend mouseup', function(e) {
    e.preventDefault(); //prevent default behavior
    $scope.send({"payload": "R1_OFF,127.0.0.1"});
});
    
})(scope);
</script>

```

---

<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:** [8 December 2019 07:52 UTC](https://discourse.nodered.org/t/ui-button-momentary-function/18894/2 "2019-12-08T07:52:24Z")

</div>

As far as I can see the underlying angular material md-button we use doesn't expose this functionality so we won't be adding it any time soon unless someone comes up with a clever pull request.

---

<div class="post-metadata">

**Author:** ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)\
**Post date:** [8 December 2019 09:05 UTC](https://discourse.nodered.org/t/ui-button-momentary-function/18894/3 "2019-12-08T09:05:07Z")

</div>

OK, I was not aware of such dependency, fine, got it

---

<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:** [8 December 2019 09:11 UTC](https://discourse.nodered.org/t/ui-button-momentary-function/18894/4 "2019-12-08T09:11:56Z")

</div>

Some ideas here

> [@Momentary button on Dashboard](https://discourse.nodered.org/t/momentary-button-on-dashboard/4906):
>
> Hello, I'm trying to create a momentary button on the dashboard. When I press it, payload should go "true", when I let go, "false" this doesn't do the trick as it sends both after I release the button: [{"id":"c07efd27.1cb3f8","type":"debug","z":"6880e39e.295cac","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":530,"y":500,"wires":[]},{"id":"d3589e5b.0c4448","type":"ui\_template","z":"6880e39e.295cac","group":"c713dff5.21ab3","name":"Toggle Butto…