# Get payload back and refresh page after button click

**URL:** <https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556>\
**Category:** Dashboard\
**Tags:** node-red-dashboard\
**Created:** [1 December 2022 13:47 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556 "2022-12-01T13:47:08Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![YT2310](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/yt2310/32/35255_2.png) [@YT2310](https://discourse.nodered.org/u/YT2310)\
**Post date:** [1 December 2022 13:47 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556/1 "2022-12-01T13:47:08Z")

</div>

Hello Together,

I am trying to generate a payload in a template-node with a single button and refresh the complete page. I need to do this to load a new header....  
But unfortunately I'm a little bit on the tube right now.

Can you help me?

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

---

<div class="post-metadata">

**Author:** ![knoepsche](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knoepsche/32/69450_2.png) [@knoepsche](https://discourse.nodered.org/u/knoepsche)\
**Post date:** [3 December 2022 16:49 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556/2 "2022-12-03T16:49:42Z")

</div>

All (button, reload, send message) done in a template node should be something like this:

```auto
[
    {
        "id": "4b2da0b58064d643",
        "type": "tab",
        "label": "Flow 1",
        "disabled": false,
        "info": "",
        "env": []
    },
    {
        "id": "67e5a02dc04c0c98",
        "type": "ui_template",
        "z": "4b2da0b58064d643",
        "group": "d921e9fe7b208126",
        "name": "My Button",
        "order": 3,
        "width": "6",
        "height": "2",
        "format": "<style>\n .custom-button{\n color:white!important;\n }\n \n</style>\n<button id=\"MyReloadButton\" class=\"custom-button md-raised md-button md-ink-ripple\" type=\"button\" ng-click=\"OnButtonClick($event)\" aria-label=\"refreshbutton\">\n <ui-icon ng-show=\"true\" icon=\"mi-refresh\" aria-hidden=\"false\">\n <div ng-if=\"iconType==='mi'\" style=\"display:inline-block; margin:auto; line-height:initial;\">\n <i class=\"material-icons mi-refresh\" ng-class=\"icon\">mybutton</i>\n </div>\n </ui-icon>\n <span>Refresh</span>\n</button>\n\n<script>\n (function(scope) {\n\n scope.InjectRipple = function() {\n const buttoninjector = angular.element('#MyReloadButton').injector();\n buttoninjector.invoke(scope.AttachReloadbuttonToRipple,null,null);\n };\n scope.AttachReloadbuttonToRipple = function($mdInkRipple){\n $mdInkRipple.attach(scope, angular.element('#MyReloadButton'), { center: false });\n }\n scope.OnButtonClick = function(evt){\n switch(evt.currentTarget.id){\n case \"MyReloadButton\":\n const someMessage = 'reload right now!';\n scope.send({payload: someMessage});\n window.location.reload();\n break;\n default:\n break;\n }\n }\n scope.InjectRipple();\n \n })(scope);\n</script>",
        "storeOutMessages": true,
        "fwdInMessages": false,
        "resendOnRefresh": true,
        "templateScope": "local",
        "className": "nr-dashboard-button _md styled-button styled-template",
        "x": 1140,
        "y": 320,
        "wires": [
            [
                "c8aaf3986a4c622c"
            ]
        ]
    },
    {
        "id": "c8aaf3986a4c622c",
        "type": "debug",
        "z": "4b2da0b58064d643",
        "name": "debug 1",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "statusVal": "",
        "statusType": "auto",
        "x": 1440,
        "y": 320,
        "wires": []
    },
    {
        "id": "d921e9fe7b208126",
        "type": "ui_group",
        "name": "Buttons",
        "tab": "d0d82445ef65a632",
        "order": 1,
        "disp": true,
        "width": "6",
        "collapse": false,
        "className": ""
    },
    {
        "id": "d0d82445ef65a632",
        "type": "ui_tab",
        "name": "ButtonDesign",
        "icon": "dashboard",
        "order": 3,
        "disabled": false,
        "hidden": false
    }
]

```

---

<div class="post-metadata">

**Author:** ![YT2310](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/yt2310/32/35255_2.png) [@YT2310](https://discourse.nodered.org/u/YT2310)\
**Post date:** [5 December 2022 07:23 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556/3 "2022-12-05T07:23:37Z")

</div>

> [@knoepsche](#):
>
> ```auto
> [
> {
> "id": "4b2da0b58064d643",
> "type": "tab",
> "label": "Flow 1",
> "disabled": false,
> "info": "",
> "env": []
> },
> {
> "id": "67e5a02dc04c0c98",
> "type": "ui_template",
> "z": "4b2da0b58064d643",
> "group": "d921e9fe7b208126",
> "name": "My Button",
> "order": 3,
> 
> ```

thanks, works fine for me

---

<div class="post-metadata">

**Author:** ![knoepsche](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knoepsche/32/69450_2.png) [@knoepsche](https://discourse.nodered.org/u/knoepsche)\
**Post date:** [5 December 2022 13:50 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556/4 "2022-12-05T13:50:30Z")

</div>

to put an delay of 2000 ms you could do:

```auto
... setTimeout(()=>{window.location.reload();}, 2000); ...

```

---

<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:** [19 December 2022 13:51 UTC](https://discourse.nodered.org/t/get-payload-back-and-refresh-page-after-button-click/71556/5 "2022-12-19T13:51:05Z")

</div>

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