# Inject JSON data to a web form

**URL:** <https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235>\
**Category:** General\
**Tags:** node-red-dashboard\
**Created:** [7 March 2023 14:13 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235 "2023-03-07T14:13:25Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 14:13 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/1 "2023-03-07T14:13:25Z")

</div>

Hey All,  
I'm learning how to work with JSON in Node Red and I'm trying to inject some JSON data into a web form so I can work on it from the back end.

On the inject node I'm using Inject --\> JSON and I've tried a bunch of variation but nothing is working.

What I think it should be is

```auto
{ "PIRApt" : "1" }

```

When I try this it says it was successfully injected but I don't see anything in the debug console. What's happening?

```auto
[
    {
        "id": "bf688d57fb5707dd",
        "type": "debug",
        "z": "574d186f6c85309d",
        "name": "debug 166",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 670,
        "y": 340,
        "wires": []
    },
    {
        "id": "2f5644744a11ca4c",
        "type": "json",
        "z": "574d186f6c85309d",
        "name": "JS OBJECT",
        "property": "payload",
        "action": "obj",
        "pretty": false,
        "x": 470,
        "y": 340,
        "wires": [
            [
                "bf688d57fb5707dd"
            ]
        ]
    },
    {
        "id": "f3cb687d4d24761b",
        "type": "ui_form",
        "z": "574d186f6c85309d",
        "name": "",
        "label": "",
        "group": "3312af4f71436b3c",
        "order": 7,
        "width": 0,
        "height": 0,
        "options": [
            {
                "label": "aptPIR",
                "value": "aptPIR",
                "type": "number",
                "required": false,
                "rows": null
            },
            {
                "label": "aptBrightness",
                "value": "aptBrightness",
                "type": "number",
                "required": false,
                "rows": null
            },
            {
                "label": "aptTimerLength",
                "value": "aptTimerLength",
                "type": "number",
                "required": false,
                "rows": null
            }
        ],
        "formValue": {
            "aptPIR": "",
            "aptBrightness": "",
            "aptTimerLength": ""
        },
        "payload": "",
        "submit": "submit",
        "cancel": "",
        "topic": "payload",
        "topicType": "msg",
        "splitLayout": "",
        "className": "",
        "x": 330,
        "y": 340,
        "wires": [
            [
                "2f5644744a11ca4c"
            ]
        ]
    },
    {
        "id": "a0375ba6b54b914c",
        "type": "inject",
        "z": "574d186f6c85309d",
        "name": "",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "{\"aptPIR\" : \"1\"}",
        "payloadType": "json",
        "x": 160,
        "y": 340,
        "wires": [
            [
                "f3cb687d4d24761b"
            ]
        ]
    },
    {
        "id": "3312af4f71436b3c",
        "type": "ui_group",
        "name": "JSON",
        "tab": "c548a45fe690539c",
        "order": 11,
        "disp": true,
        "width": "6",
        "collapse": false,
        "className": ""
    },
    {
        "id": "c548a45fe690539c",
        "type": "ui_tab",
        "name": "Home",
        "icon": "dashboard",
        "order": 1,
        "disabled": false,
        "hidden": true
    }
]

```

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [7 March 2023 14:26 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/2 "2023-03-07T14:26:55Z")

</div>

`aptPIR` in the form is type number, you are trying to set it to `"1"` string

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 15:22 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/3 "2023-03-07T15:22:16Z")

</div>

OK, I see that now. It should like this yes?

```auto
{"aptPIR" : 1}

```

Still doesn't work

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [7 March 2023 15:38 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/4 "2023-03-07T15:38:52Z")

</div>

Works here you must be doing something else different

 ![image8](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/e/eebe90de14a44ea6c11344b29d21767f2483e483.jpeg)

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 15:53 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/5 "2023-03-07T15:53:40Z")

</div>

hmm, this is what I have

````auto
[
    {
        "id": "a0375ba6b54b914c",
        "type": "inject",
        "z": "574d186f6c85309d",
        "name": "",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "{\"aptPIR\" : 1}",
        "payloadType": "json",
        "x": 150,
        "y": 340,
        "wires": [
            [
                "f3cb687d4d24761b"
            ]
        ]
    },
    {
        "id": "f3cb687d4d24761b",
        "type": "ui_form",
        "z": "574d186f6c85309d",
        "name": "",
        "label": "",
        "group": "3312af4f71436b3c",
        "order": 7,
        "width": 0,
        "height": 0,
        "options": [
            {
                "label": "aptPIR",
                "value": "aptPIR",
                "type": "number",
                "required": false,
                "rows": null
            },
            {
                "label": "aptBrightness",
                "value": "aptBrightness",
                "type": "number",
                "required": false,
                "rows": null
            },
            {
                "label": "aptTimerLength",
                "value": "aptTimerLength",
                "type": "number",
                "required": false,
                "rows": null
            }
        ],
        "formValue": {
            "aptPIR": "",
            "aptBrightness": "",
            "aptTimerLength": ""
        },
        "payload": "",
        "submit": "submit",
        "cancel": "",
        "topic": "payload",
        "topicType": "msg",
        "splitLayout": "",
        "className": "",
        "x": 310,
        "y": 340,
        "wires": [
            [
                "2f5644744a11ca4c"
            ]
        ]
    },
    {
        "id": "2f5644744a11ca4c",
        "type": "json",
        "z": "574d186f6c85309d",
        "name": "JS OBJECT",
        "property": "payload",
        "action": "obj",
        "pretty": false,
        "x": 490,
        "y": 340,
        "wires": [
            [
                "bf688d57fb5707dd"
            ]
        ]
    },
    {
        "id": "bf688d57fb5707dd",
        "type": "debug",
        "z": "574d186f6c85309d",
        "name": "debug 166",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "payload",
        "targetType": "msg",
        "statusVal": "",
        "statusType": "auto",
        "x": 670,
        "y": 340,
        "wires": []
    },
    {
        "id": "3312af4f71436b3c",
        "type": "ui_group",
        "name": "JSON",
        "tab": "c548a45fe690539c",
        "order": 11,
        "disp": true,
        "width": "6",
        "collapse": false,
        "className": ""
    },
    {
        "id": "c548a45fe690539c",
        "type": "ui_tab",
        "name": "Home",
        "icon": "dashboard",
        "order": 1,
        "disabled": false,
        "hidden": true
    }
]```
````

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [7 March 2023 15:57 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/6 "2023-03-07T15:57:14Z")

</div>

Your flow works for me to, even with the unneeded JSON node.  
What version of dashboard are you using?

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 16:13 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/7 "2023-03-07T16:13:45Z")

</div>

hmmm, it's the current version 3.3.1

Note, I do see the results when I fill out the form from the front end.

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [7 March 2023 16:20 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/8 "2023-03-07T16:20:30Z")

</div>

What version of NR?

I see output in the debug node whither pressing the inject or entering data on the form.

Try restarting NR and flushing your browsers cache.

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 16:30 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/9 "2023-03-07T16:30:49Z")

</div>

tried restarting and flusing the browser...still no beans. Weird. Thanks guys for helping so far.

 ![sucessfully injected](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/e/ce6a4f653d7780ddb02d1055ee557c189b27490e.png)

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [7 March 2023 16:37 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/10 "2023-03-07T16:37:42Z")

</div>

Just to be sure.  
The inject will only populate the form, it will not submit it.

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [7 March 2023 16:54 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/11 "2023-03-07T16:54:18Z")

</div>

Do you have your debug node (set to display the complete msg object)? Also try adding a catch node connected to another debug (node set to display the complete msg object)

As @E1cid said, go to the form and press the 'SUBMIT'

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 16:56 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/12 "2023-03-07T16:56:03Z")

</div>

OK thank you! you've identified the problem. Now what?

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [7 March 2023 16:59 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/13 "2023-03-07T16:59:14Z")

</div>

> [@richiep](#):
>
> Now what?

define `what` please.

If you want to submit straight from the inject bypass the form  
e.g.

```auto
[{"id":"45f56547d653956c","type":"inject","z":"d6c1f08ec046990c","name":"","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"aptPIR\":1,\"aptBrightness\":null,\"aptTimerLength\":null}","payloadType":"json","x":150,"y":320,"wires":[["08961f444a46c69b","c22d5ce3d5431999"]]},{"id":"08961f444a46c69b","type":"debug","z":"d6c1f08ec046990c","name":"debug 166","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":550,"y":340,"wires":[]},{"id":"c22d5ce3d5431999","type":"junction","z":"d6c1f08ec046990c","x":240,"y":380,"wires":[["4014f03cab2cf0d8"]]},{"id":"4014f03cab2cf0d8","type":"ui_form","z":"d6c1f08ec046990c","name":"","label":"","group":"3312af4f71436b3c","order":7,"width":0,"height":0,"options":[{"label":"aptPIR","value":"aptPIR","type":"number","required":false,"rows":null},{"label":"aptBrightness","value":"aptBrightness","type":"number","required":false,"rows":null},{"label":"aptTimerLength","value":"aptTimerLength","type":"number","required":false,"rows":null}],"formValue":{"aptPIR":"","aptBrightness":"","aptTimerLength":""},"payload":"","submit":"submit","cancel":"","topic":"payload","topicType":"msg","splitLayout":"","className":"","x":350,"y":380,"wires":[["08961f444a46c69b","c22d5ce3d5431999"]]},{"id":"3312af4f71436b3c","type":"ui_group","name":"JSON","tab":"c548a45fe690539c","order":11,"disp":true,"width":"6","collapse":false,"className":""},{"id":"c548a45fe690539c","type":"ui_tab","name":"Home","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

If you want to reload the data to the form after a submit, loop the output back to the input.

---

<div class="post-metadata">

**Author:** ![richiep](https://avatars.discourse-cdn.com/v4/letter/r/59ef9b/32.png) [@richiep](https://discourse.nodered.org/u/richiep)\
**Post date:** [7 March 2023 17:03 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/14 "2023-03-07T17:03:44Z")

</div>

Thank You! Much gratitude.

---

<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:** [21 March 2023 17:03 UTC](https://discourse.nodered.org/t/inject-json-data-to-a-web-form/76235/15 "2023-03-21T17:03:53Z")

</div>

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