# Text input + Button

**URL:** <https://discourse.nodered.org/t/text-input-button/15058>\
**Category:** Dashboard\
**Created:** [3 September 2019 12:55 UTC](https://discourse.nodered.org/t/text-input-button/15058 "2019-09-03T12:55:20Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [3 September 2019 12:55 UTC](https://discourse.nodered.org/t/text-input-button/15058/1 "2019-09-03T12:55:20Z")

</div>

Hello , I want to take user input through text box and then write this data in the file using button. .So basically after taking user input , i store it in the function node What i want to do is , after clicking the button the data should get stored in the file. I am able to write the data in the file without using the button.I have added the button in the flow but when i click the button i get d7360f0c.781c2 in the file. I don't know why is this happening . Am i missing something in the flow ? Please let me know.

I have also read some solutions related to this issue on this forum but i couldn't find proper solution. The link i have referred : [Send value of input text when click on button](https://discourse.nodered.org/t/send-value-of-input-text-when-click-on-button/10015).

My Flow:

```auto
[{"id":"224894f3.ecbecc","type":"tab","label":"Flow 5","disabled":false,"info":""},{"id":"ea233531.023898","type":"function","z":"224894f3.ecbecc","name":"take data","func":"//var d = new Date();\n//var t = d.getTime();\ncontext.data = context.data || {}\nvar data = context.data.task1 \n// context.data.task1 = parseInt(msg.payload);\ncontext.data.task1 = String(msg.payload);\n//payload = {\"time\":t,\"payload\":msg.payload,\"topic\":msg.topic};\n//msg.payload = payload;\nreturn msg;","outputs":1,"noerr":0,"x":280,"y":400,"wires":[["4e640aac.7ba404","c8f82b90.a25518","ec646cd8.2e673"]]},{"id":"4e640aac.7ba404","type":"json","z":"224894f3.ecbecc","name":"","property":"payload","action":"str","pretty":false,"x":430,"y":280,"wires":[["485cefd8.eea7f"]]},{"id":"485cefd8.eea7f","type":"file","z":"224894f3.ecbecc","name":"","filename":"C:\\Users\\vishakha\\Desktop\\Node Red\\hi","appendNewline":true,"createDir":false,"overwriteFile":"false","encoding":"none","x":680,"y":360,"wires":[[]]},{"id":"4891629e.0a785c","type":"ui_text_input","z":"224894f3.ecbecc","name":"Enter Product Key ","label":"Product Key","tooltip":"","group":"f1a2366f.a829f8","order":1,"width":0,"height":0,"passthru":true,"mode":"text","delay":"0","topic":"task1","x":130,"y":180,"wires":[["ea233531.023898"]]},{"id":"c8f82b90.a25518","type":"ui_button","z":"224894f3.ecbecc","name":"","group":"f1a2366f.a829f8","order":2,"width":0,"height":0,"passthru":false,"label":"Enter ","tooltip":"","color":"","bgcolor":"Red","icon":"","payload":"msg","payloadType":"str","topic":"","x":450,"y":500,"wires":[[]]},{"id":"ec646cd8.2e673","type":"debug","z":"224894f3.ecbecc","name":"Take Data","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":410,"y":580,"wires":[]},{"id":"f1a2366f.a829f8","type":"ui_group","z":"","name":"Enter Product Key ","tab":"3e42440f.5b487c","disp":true,"width":"6","collapse":false},{"id":"3e42440f.5b487c","type":"ui_tab","z":"","name":"Relay Board Page 1","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [3 September 2019 12:57 UTC](https://discourse.nodered.org/t/text-input-button/15058/2 "2019-09-03T12:57:07Z")

</div>

Unfortunately, your flow can't be imported as the forum software merges some of the characters. To get around that, please post your flow again following the instructions in the following post: [How to share code or flow json](https://discourse.nodered.org/t/how-to-share-code-or-flow-json/506)

---

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [3 September 2019 12:58 UTC](https://discourse.nodered.org/t/text-input-button/15058/3 "2019-09-03T12:58:25Z")

</div>

Ohh okay , thanks. I will send it again . Actually i am new to this platform.

---

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [3 September 2019 13:00 UTC](https://discourse.nodered.org/t/text-input-button/15058/4 "2019-09-03T13:00:08Z")

</div>

```auto
[{"id":"224894f3.ecbecc","type":"tab","label":"Flow 5","disabled":false,"info":""},{"id":"ea233531.023898","type":"function","z":"224894f3.ecbecc","name":"take data","func":"//var d = new Date();\n//var t = d.getTime();\ncontext.data = context.data || {}\nvar data = context.data.task1 \n// context.data.task1 = parseInt(msg.payload);\ncontext.data.task1 = String(msg.payload);\n//payload = {\"time\":t,\"payload\":msg.payload,\"topic\":msg.topic};\n//msg.payload = payload;\nreturn msg;","outputs":1,"noerr":0,"x":280,"y":400,"wires":[["4e640aac.7ba404","c8f82b90.a25518","ec646cd8.2e673"]]},{"id":"4e640aac.7ba404","type":"json","z":"224894f3.ecbecc","name":"","property":"payload","action":"str","pretty":false,"x":430,"y":280,"wires":[["485cefd8.eea7f"]]},{"id":"485cefd8.eea7f","type":"file","z":"224894f3.ecbecc","name":"","filename":"C:\\Users\\vishakha\\Desktop\\Node Red\\hi","appendNewline":true,"createDir":false,"overwriteFile":"false","encoding":"none","x":680,"y":360,"wires":[[]]},{"id":"4891629e.0a785c","type":"ui_text_input","z":"224894f3.ecbecc","name":"Enter Product Key ","label":"Product Key","tooltip":"","group":"f1a2366f.a829f8","order":1,"width":0,"height":0,"passthru":true,"mode":"text","delay":"0","topic":"task1","x":130,"y":180,"wires":[["ea233531.023898"]]},{"id":"c8f82b90.a25518","type":"ui_button","z":"224894f3.ecbecc","name":"","group":"f1a2366f.a829f8","order":2,"width":0,"height":0,"passthru":false,"label":"Enter ","tooltip":"","color":"","bgcolor":"Red","icon":"","payload":"msg","payloadType":"str","topic":"","x":450,"y":500,"wires":[[]]},{"id":"ec646cd8.2e673","type":"debug","z":"224894f3.ecbecc","name":"Take Data","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":410,"y":580,"wires":[]},{"id":"f1a2366f.a829f8","type":"ui_group","z":"","name":"Enter Product Key ","tab":"3e42440f.5b487c","disp":true,"width":"6","collapse":false},{"id":"3e42440f.5b487c","type":"ui_tab","z":"","name":"Relay Board Page 1","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [3 September 2019 13:10 UTC](https://discourse.nodered.org/t/text-input-button/15058/5 "2019-09-03T13:10:58Z")

</div>

Couple things I'm seeing.  
In your function node you have

```auto
context.data = context.data || {}
var data = context.data.task1 

```

This is going to give an error on the first run when the `context.data` is empty or rather an empty object. Meaning there will be no property `task1`.  
Below that you set `context.data.task1` to `String(msg.payload);`. The variable `data` is not used below. It was used in debugging code that is commented out. Then you return msg, so the msg that is passed from the product key node is still like that. That message is then forwarded to your JSON node so it's creating a JSON string from it. That is then appended to your file.

The Button on your dashboard is not doing anything. Clicking it will output a message with payload `"msg"` as it is set to, but since there are no wires going out nothing will happen.

The actual Product Key text input is set to send out the all the text in the field when pressing enter or tab, with the topic set to `task1`, and the payload set to the text value in the field.

Have you checked the context tab in Node-RED to see what is stored?  
Furthermore I would advise you to go back to the link you shared in your opening post, and check the nodes in the image there. Those are change nodes, and your flow would improve if you were to use those. If you follow the image of that flow you should get the answer.

---

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [6 September 2019 07:05 UTC](https://discourse.nodered.org/t/text-input-button/15058/6 "2019-09-06T07:05:26Z")

</div>

Hello , thanks for your reply but i am not able to do it. I am damn confused. I also found posts about change node, q node , switch node. As you said refer the link which i had sent , i referred it .I have also referred the cook book .But couldn't find the exact solution.  
Regarding this:  
context.data = context.data || {}  
var data = context.data.task1  
I understood my mistake.

Now to store the data i found this flow :

```auto
[{"id":"ea31912b.28d0f","type":"tab","label":"Flow 2","disabled":false,"info":""},{"id":"880eac89.16813","type":"ui_button","z":"ea31912b.28d0f","name":"","group":"da5ab001.cbe88","order":32,"width":0,"height":0,"passthru":false,"label":"save","tooltip":"","color":"","bgcolor":"","icon":"","payload":"","payloadType":"str","topic":"save","x":210,"y":260,"wires":[["edd11e33.d38fe"]]},{"id":"7c3f783c.84a9c8","type":"ui_text_input","z":"ea31912b.28d0f","name":"","label":"text","tooltip":"","group":"da5ab001.cbe88","order":31,"width":0,"height":0,"passthru":false,"mode":"text","delay":"0","topic":"text","x":210,"y":180,"wires":[["edd11e33.d38fe"]]},{"id":"edd11e33.d38fe","type":"function","z":"ea31912b.28d0f","name":"text","func":"var data = context.get(\"data\") || 0;\n\nif(msg.topic === \"text\"){\n data = msg.payload;\n context.set(\"data\",data);\n}\nif(msg.topic === \"save\"){\n msg.payload = data;\n}\n\nreturn msg;","outputs":1,"noerr":0,"x":470,"y":240,"wires":[["761139d0.881cd8"]]},{"id":"761139d0.881cd8","type":"debug","z":"ea31912b.28d0f","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":640,"y":240,"wires":[]},{"id":"da5ab001.cbe88","type":"ui_group","z":"","name":"Meniu Principal","tab":"a7edec63.9982f","order":1,"disp":false,"width":"12","collapse":false},{"id":"a7edec63.9982f","type":"ui_tab","z":"","name":"USV","icon":"dashboard","order":1}]

```

when i write the text in text box it gets printed on debug window without even clicking the button .Why is this happening? Please help me!  
If possible ,could you please send me the flow?  
Thanks!

---

<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:** [6 September 2019 07:27 UTC](https://discourse.nodered.org/t/text-input-button/15058/7 "2019-09-06T07:27:59Z")

</div>

```auto
var data = context.get("data") || 0;

if(msg.topic === "text"){
    data = msg.payload;
    context.set("data",data);
    //if no output is needed while writting, stop the flow right here
    return
}
if(msg.topic === "save"){
    msg.payload = data;
}

return msg;

```

---

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [6 September 2019 08:00 UTC](https://discourse.nodered.org/t/text-input-button/15058/8 "2019-09-06T08:00:20Z")

</div>

Hello Sir , Thanks a lot for the solution . It's working!!😀😀  
But what if i have multiple inputs (text boxes) + button ? will it be same?  
Thanks  
😄

---

<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:** [6 September 2019 08:40 UTC](https://discourse.nodered.org/t/text-input-button/15058/9 "2019-09-06T08:40:00Z")

</div>

Best thing to do is to try it out. 🙂  
And if things go wrong, you'll need to share a bit of the flow because of right now your question is a bit not that clear to give strong answer.

---

<div class="post-metadata">

**Author:** ![Vishakha](https://avatars.discourse-cdn.com/v4/letter/v/aca169/32.png) [@Vishakha](https://discourse.nodered.org/u/Vishakha)\
**Post date:** [6 September 2019 09:13 UTC](https://discourse.nodered.org/t/text-input-button/15058/10 "2019-09-06T09:13:20Z")

</div>

Yes now I am working on it!!  
Actually i want to take multiple user inputs , and when i click a submit button the entered data should get stored in a file. Like i want to make a simple form which contains name, Address , Phone No., Country etc. and the submit button.

---

<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:** [6 September 2019 09:18 UTC](https://discourse.nodered.org/t/text-input-button/15058/11 "2019-09-06T09:18:23Z")

</div>

There is built in ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/1/1a3f8ec9c072a27d060e4b97661d3739d3727cc6.png) node to cover this kind of needs.  
But of course you can create your own solution. 🙂

---

<div class="post-metadata">

**Author:** ![abhishek](https://avatars.discourse-cdn.com/v4/letter/a/7ba0ec/32.png) [@abhishek](https://discourse.nodered.org/u/abhishek)\
**Post date:** [12 January 2021 14:49 UTC](https://discourse.nodered.org/t/text-input-button/15058/12 "2021-01-12T14:49:48Z")

</div>

Hello Vishaka,  
If you have completed the project of taking multiple user input + button and storing in the file, could you please share the flow?

I am also working on a similar concept and it would be of great help.

---

<div class="post-metadata">

**Author:** ![pranavthakkar](https://avatars.discourse-cdn.com/v4/letter/p/e99b99/32.png) [@pranavthakkar](https://discourse.nodered.org/u/pranavthakkar)\
**Post date:** [2 February 2021 13:04 UTC](https://discourse.nodered.org/t/text-input-button/15058/13 "2021-02-02T13:04:21Z")

</div>

hi abhishek.  
what problem you are facing ?

---

<div class="post-metadata">

**Author:** ![abhishek](https://avatars.discourse-cdn.com/v4/letter/a/7ba0ec/32.png) [@abhishek](https://discourse.nodered.org/u/abhishek)\
**Post date:** [2 February 2021 16:47 UTC](https://discourse.nodered.org/t/text-input-button/15058/14 "2021-02-02T16:47:32Z")

</div>

The problem got solved.

You can view the discussion here:

> [@Receiving data from multiple nodes and uploading it to sqlite database](https://discourse.nodered.org/t/receiving-data-from-multiple-nodes-and-uploading-it-to-sqlite-database/37642):
>
> Hello All, I am making a UI where I need to store the UUID and part number along with the timestamp into an SQLite database. The values are taken from the user input which is numbers. I need to take the value from multiple inputs node and then insert it into the database. Blockquote below is my function node: //MY FN var data=context.get('data')|| {value:""}; // var to get data from a node .. use context.get method var topic=msg.topic; var payload=msg.payload; if (topic=="tagid") da…

Thanks for help !

---

<div class="post-metadata">

**Author:** ![jetp1994](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jetp1994/32/48233_2.png) [@jetp1994](https://discourse.nodered.org/u/jetp1994)\
**Post date:** [18 September 2021 17:37 UTC](https://discourse.nodered.org/t/text-input-button/15058/15 "2021-09-18T17:37:30Z")

</div>

@Vishakha Hi. Could you share you flow after fixing it? I’m doing something like this. Thanks