# Dashboard number input with +/- Buttons for changes

**URL:** https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705
**Category:** Dashboard
**Tags:** node-red-dashboard
**Created:** [14 September 2022 14:01 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705 "2022-09-14T14:01:26Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![Gnomi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gnomi/32/67756_2.png) [@Gnomi](https://discourse.nodered.org/u/Gnomi)
#### Post date: [14 September 2022 14:01 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705/1 "2022-09-14T14:01:26Z")

</div>

For entering data I need a simple field showing the value from msg.payload and beside the value little buttons "+" "-" to increment or decrement the value on the output. I hope I did not oversaw a solution here or a link to a dashboard extension.

---

<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 September 2022 14:14 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705/2 "2022-09-14T14:14:30Z")

</div>

The ui-numeric node has up and down arrows. Is that OK ?  
Otherwise the ui-text node in number mode will render however your browser renders numeric type inputs

---

<div class="post-metadata">

### Author: ![Napest](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/napest/32/55656_2.png) [@Napest](https://discourse.nodered.org/u/Napest)
#### Post date: [14 September 2022 20:12 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705/3 "2022-09-14T20:12:37Z")

</div>

Hi,

it is perfectly fine to use ui-numeric like dceejay sugested.  
If you want +/- buttons to be consistent with other dashboard buttons, you can try this:

```auto
[{"id":"9312030cbc08cb02","type":"tab","label":"Flow 1","disabled":false,"info":"","env":[]},{"id":"099fad1b20feea8a","type":"ui_button","z":"9312030cbc08cb02","name":"increment","group":"7398a6b80bbb57c0","order":1,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","className":"","icon":"fa-plus fa-2x","payload":"1","payloadType":"num","topic":"topic","topicType":"msg","x":210,"y":220,"wires":[["293d3725a5283041"]]},{"id":"5932ad2ad184128c","type":"ui_button","z":"9312030cbc08cb02","name":"decrement","group":"7398a6b80bbb57c0","order":2,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","className":"","icon":"fa-minus fa-2x","payload":"-1","payloadType":"num","topic":"topic","topicType":"msg","x":210,"y":260,"wires":[["293d3725a5283041"]]},{"id":"293d3725a5283041","type":"function","z":"9312030cbc08cb02","name":"","func":"var result = flow.get(\"result\")||0;\nmsg.payload = result + msg.payload;\nflow.set(\"result\", msg.payload);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":400,"y":240,"wires":[["5c78a19f8edc1df8"]]},{"id":"5c78a19f8edc1df8","type":"ui_text","z":"9312030cbc08cb02","group":"7398a6b80bbb57c0","order":3,"width":4,"height":1,"name":"","label":"result","format":"{{msg.payload}}","layout":"row-spread","className":"","x":550,"y":240,"wires":[]},{"id":"7398a6b80bbb57c0","type":"ui_group","name":"Tab1","tab":"81896b925ac877f3","order":1,"disp":false,"width":"6","collapse":false,"className":""},{"id":"81896b925ac877f3","type":"ui_tab","name":"Home","icon":"","order":1,"disabled":false,"hidden":false}]

```

It is nothing more than two buttons with icons and one function block with one context variable.

---

<div class="post-metadata">

### Author: ![Gnomi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gnomi/32/67756_2.png) [@Gnomi](https://discourse.nodered.org/u/Gnomi)
#### Post date: [15 September 2022 15:56 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705/4 "2022-09-15T15:56:20Z")

</div>

Thanks dceejay, I really did not recognize these numeric node options. A simple and good first solution.  
And also good Napest, perhaps for my later tuning.

---

<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: [29 September 2022 15:57 UTC](https://discourse.nodered.org/t/dashboard-number-input-with-buttons-for-changes/67705/5 "2022-09-29T15:57:02Z")

</div>

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