# Dashboard text input node - avoid global state

**URL:** <https://discourse.nodered.org/t/dashboard-text-input-node-avoid-global-state/30744>\
**Category:** Dashboard\
**Created:** [26 July 2020 21:39 UTC](https://discourse.nodered.org/t/dashboard-text-input-node-avoid-global-state/30744 "2020-07-26T21:39:38Z")\
**Posts on this page:** 1\
**Showing post:** 16

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [1 August 2020 22:03 UTC](https://discourse.nodered.org/t/dashboard-text-input-node-avoid-global-state/30744/16 "2020-08-01T22:03:34Z")

</div>

> [@davej](#):
>
> I do not want to use a button

If anybody ever needs it, I had another Template node to display a button. In that Template node, I send the values of the Text Input fields to the server as a message (as soon as the button is clicked):

```auto
<md-button ng-click="onClick()">Send text to Node-RED</md-button>

<script>
(function(scope) {
    scope.onClick= function() {
        // Here I read the values from the my custom text input field (which needs to have id="my_unique_id")
        var myTextInputElement = document.getElementById('my_unique_id').value || "My default text";
        
        // Send a message on the output of the Button Template node, containing the value of the text input field
        scope.send({
            my_text: myTextInputElement
        });
    }
})(scope);
</script>

```

Remark: since this code snippet tries to find a text input element on your dashboard with id _"my\_unique\_id"_, don't forget to apply that id to your text input element:

```auto
<md-card class="nr-dashboard-textinput" style="margin-top:8px; margin-bottom:0px; margin-left:6px; margin-right:6px">
    <md-input-container class="md-block has-label" style="padding:0px; margin:0px">
        <label style="padding:0px">Notification Body</label>
        <input type="text" id="my_unique_id">
    </md-input-container>
</md-card>

```

In case of multiple text input elements, you need to give each element its own unique id!

> [@davej](#):
>
> either by a tab key or enter key being pressed

Based on the above onClick function, I had thought your question could be solved by changing my Text Input Template node code like this:

```auto
<md-card class="nr-dashboard-textinput" style="margin-top:8px; margin-bottom:0px; margin-left:6px; margin-right:6px">
    <md-input-container class="md-block has-label" style="padding:0px; margin:0px">
        <label style="padding:0px">Notification Body</label>
        <input type="text" id="notification_body" onkeydown="handleOnkeydown(this)">
    </md-input-container>
</md-card>

<script>
(function(scope) {
    scope.handleOnkeydown= function(inputElement) {
        // Send the text value to the server, when the Enter key is being pressed
        if(event.key === 'Enter') { 
            send({value: inputElement.value}); 
        }
    }
})(scope);
</script>

```

But it gives me the following error:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/c/9c633dd64bed04ffb9a5674f276a9ec5d94ceef8.png)

Does anybody know how to solve this?

---

_[View the full topic](https://discourse.nodered.org/t/dashboard-text-input-node-avoid-global-state/30744)._