Form Widget on Dashboard and IoT Applications

The form widget allows to dynamically create a form for user input collection on the Dashboard. The input kind can be :

  • text,number, email, password, checkbox, switch, data, time.

A good example is reported in the following. The form widget in the IoT App Node-RED has the following node symbol.

The form on dashboard can be realized by configuring the form node into IOT App, or sending the configuration JSON into the node as follows:

the JavaScript to send the JSON is as follows:

msg.payload ={ "form": { "options": [
{ "label": "enter text", "value": "", "type": "text", "required": true }, 
{ "label": "enter number", "value": "", "type": "number", "required": false }, 
{ "label": "enter email", "value": "", "type": "email", "required": false }, 
{ "label": "enter password", "value": "", "type": "password", "required": false }, 
{ "label": "enter check", "value": "checked", "type": "checkbox", "required": false }, 
{ "label": "enter check2", "value": "", "type": "checkbox", "required": false }, 
{ "label": "enter switch", "value": "on", "type": "switch", "required": false }, 
{ "label": "enter switch2", "value": "", "type": "switch", "required": false }, 
{ "label": "enter date", "value": "", "type": "date", "required": false }, 
{ "label": "enter time", "value": "", "type": "time", "required": true }
 ], "selected": [] } } 
return msg;
 

The resulting message in JSON will report the input performed by the user:

"selected":["a text","123", "paolo.nesi@unifi.it","aaaaaa", "checked","","on","","2021-03-19","09:38"]