# Hide button on dashboard form node

**URL:** <https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555>\
**Category:** Dashboard\
**Tags:** node-red-dashboard\
**Created:** [14 April 2023 06:26 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555 "2023-04-14T06:26:29Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![TrevorBishop](https://avatars.discourse-cdn.com/v4/letter/t/8e8cbc/32.png) [@TrevorBishop](https://discourse.nodered.org/u/TrevorBishop)\
**Post date:** [14 April 2023 06:26 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/1 "2023-04-14T06:26:29Z")

</div>

Hello,  
I am new to using dashboards in node-red and hope someone here can assist me with the node-red-dashboard nodes.  
I was wondering if there is an easy way to hide the cancel button that is inside the form node and only leave the submit\update button active.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/a/1abb8cf1674c2b8314a346e0064fe299a4d919ea.png)  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/0/503f34a47a0244b0c5755f706fac0787fc594b64.png)  
I like the fast setup of using the dashboard, but most of the time I only want to make small changes like the above. If anyone can advise on the best way to make this change. If I need to use the UI template node, how do direct a hidden command to this button on this form. I tried to inspect the HTML page, but there are no ideas on that button to call directly to. Any help with this would be great.

---

<div class="post-metadata">

**Author:** ![TrevorBishop](https://avatars.discourse-cdn.com/v4/letter/t/8e8cbc/32.png) [@TrevorBishop](https://discourse.nodered.org/u/TrevorBishop)\
**Post date:** [14 April 2023 06:27 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/2 "2023-04-14T06:27:23Z")

</div>

Adding an extra image here.  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/1/01a0e280ce1bacc9c320ae96c7bf81f212f5219c.png)

---

<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 April 2023 06:32 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/3 "2023-04-14T06:32:48Z")

</div>

Just delete the contents from cancel option.

---

<div class="post-metadata">

**Author:** ![TrevorBishop](https://avatars.discourse-cdn.com/v4/letter/t/8e8cbc/32.png) [@TrevorBishop](https://discourse.nodered.org/u/TrevorBishop)\
**Post date:** [14 April 2023 06:40 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/4 "2023-04-14T06:40:10Z")

</div>

Well that sure was an easy solution, not sure why I did not think to do that haha.  
But in cause there was a case I need to make it appear and disappear, what would be the best way to handle 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 April 2023 07:01 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/5 "2023-04-14T07:01:35Z")

</div>

Then you'll need to make CSS classes to manipulate that button element visibility. You can use `msg.className` to add and remove CSS classes of dashoard widget.

```auto
[{"id":"335c379e74fcc961","type":"ui_form","z":"a248fb5a07a475d7","name":"","label":"","group":"da624dc283431947","order":0,"width":0,"height":0,"options":[{"label":"aa","value":"aa","type":"text","required":true,"rows":null},{"label":"bb","value":"bb","type":"text","required":false,"rows":null}],"formValue":{"aa":"","bb":""},"payload":"","submit":"submit","cancel":"cancel","topic":"topic","topicType":"msg","splitLayout":"","className":"","x":450,"y":230,"wires":[[]]},{"id":"f1a1ecefecdce7f4","type":"inject","z":"a248fb5a07a475d7","name":"show-cancel","props":[{"p":"className","v":"show-cancel","vt":"str"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":230,"y":190,"wires":[["335c379e74fcc961"]]},{"id":"ca61210d530f8543","type":"inject","z":"a248fb5a07a475d7","name":"hide cancel","props":[{"p":"className","v":"hide-cancel","vt":"str"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":230,"y":240,"wires":[["335c379e74fcc961"]]},{"id":"633e85819047b089","type":"ui_template","z":"a248fb5a07a475d7","group":"da624dc283431947","name":"CSS","order":1,"width":0,"height":0,"format":"<style>\n .hide-cancel button[type=\"button\"]{\n display:none;\n }\n .show-cancel button[type=\"button\"]{\n display:inline-block;\n }\n</style>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"global","className":"","x":250,"y":130,"wires":[[]]},{"id":"da624dc283431947","type":"ui_group","name":"Default","tab":"a54106ae4134fcbf","order":1,"disp":true,"width":"6","collapse":false,"className":""},{"id":"a54106ae4134fcbf","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![TrevorBishop](https://avatars.discourse-cdn.com/v4/letter/t/8e8cbc/32.png) [@TrevorBishop](https://discourse.nodered.org/u/TrevorBishop)\
**Post date:** [14 April 2023 07:03 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/6 "2023-04-14T07:03:02Z")

</div>

Thank you, you have been most helpful!

---

<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:** [28 April 2023 07:03 UTC](https://discourse.nodered.org/t/hide-button-on-dashboard-form-node/77555/7 "2023-04-28T07:03:44Z")

</div>

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