Dashboard that can send two or more values when button activates

pvanklink · 7 January 2020 15:26

I cant get my dashboard working with more than two textvalues and sending them as separate values so i can use them in a subflow after the button is activated.
When this testcase works a will have a listbox with ipadressen to choose and a listbox with OS commands to execute. When the button is activate it will check the choosen server and execute the selected command.

I have the executing working , but cant pass more then one value when the button is activated

Naamloos

[
    {
        "id": "da3e4843.e44578",
        "type": "tab",
        "label": "Flow 1",
        "disabled": false,
        "info": ""
    },
    {
        "id": "416842e7.18fcac",
        "type": "ui_button",
        "z": "da3e4843.e44578",
        "name": "",
        "group": "63a7122a.653c4c",
        "order": 3,
        "width": 0,
        "height": 0,
        "passthru": false,
        "label": "Do stuff",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "icon": "",
        "payload": "textInput1",
        "payloadType": "flow",
        "topic": "",
        "x": 180,
        "y": 360,
        "wires": [
            [
                "fd9e1433.595398"
            ]
        ]
    },
    {
        "id": "a55d5c3f.f259f",
        "type": "ui_text_input",
        "z": "da3e4843.e44578",
        "name": "",
        "label": "",
        "tooltip": "",
        "group": "63a7122a.653c4c",
        "order": 1,
        "width": 0,
        "height": 0,
        "passthru": true,
        "mode": "text",
        "delay": "100",
        "topic": "",
        "x": 120,
        "y": 120,
        "wires": [
            [
                "f309674.f462f98"
            ]
        ]
    },
    {
        "id": "fd9e1433.595398",
        "type": "function",
        "z": "da3e4843.e44578",
        "name": "my function that does stuff",
        "func": "\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "x": 410,
        "y": 360,
        "wires": [
            [
                "c8af5121.0fbb9"
            ]
        ]
    },
    {
        "id": "c8af5121.0fbb9",
        "type": "ui_text",
        "z": "da3e4843.e44578",
        "group": "63a7122a.653c4c",
        "order": 2,
        "width": 0,
        "height": 0,
        "name": "",
        "label": "Result: ",
        "format": "{{msg.payload}}",
        "layout": "row-left",
        "x": 640,
        "y": 360,
        "wires": []
    },
    {
        "id": "f309674.f462f98",
        "type": "change",
        "z": "da3e4843.e44578",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "textInput2",
                "pt": "flow",
                "to": "payload",
                "tot": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 370,
        "y": 120,
        "wires": [
            [
                "45e7e288.76564c"
            ]
        ]
    },
    {
        "id": "45e7e288.76564c",
        "type": "link out",
        "z": "da3e4843.e44578",
        "name": "",
        "links": [
            "16d8779a.6e20e8",
            "aa966c98.0fd6e",
            "b0c56eba.88147",
            "4f5a3d06.686674"
        ],
        "x": 535,
        "y": 120,
        "wires": []
    },
    {
        "id": "16d8779a.6e20e8",
        "type": "link in",
        "z": "da3e4843.e44578",
        "name": "",
        "links": [
            "45e7e288.76564c",
            "c564ce94.1ab4f",
            "ef12cc40.85532"
        ],
        "x": 55,
        "y": 360,
        "wires": [
            [
                "416842e7.18fcac"
            ]
        ]
    },
    {
        "id": "3456b0cf.9dc1e",
        "type": "inject",
        "z": "da3e4843.e44578",
        "name": "Init with empty string",
        "topic": "",
        "payload": "",
        "payloadType": "str",
        "repeat": "",
        "crontab": "",
        "once": true,
        "onceDelay": 0.1,
        "x": 140,
        "y": 60,
        "wires": [
            [
                "a55d5c3f.f259f"
            ]
        ]
    },
    {
        "id": "1ed96ab5.b27b85",
        "type": "inject",
        "z": "da3e4843.e44578",
        "name": "Init with empty string",
        "topic": "",
        "payload": "",
        "payloadType": "str",
        "repeat": "",
        "crontab": "",
        "once": true,
        "onceDelay": 0.1,
        "x": 120,
        "y": 180,
        "wires": [
            [
                "6c59841b.20168c"
            ]
        ]
    },
    {
        "id": "6c59841b.20168c",
        "type": "ui_text_input",
        "z": "da3e4843.e44578",
        "name": "",
        "label": "",
        "tooltip": "",
        "group": "63a7122a.653c4c",
        "order": 1,
        "width": 0,
        "height": 0,
        "passthru": true,
        "mode": "text",
        "delay": "100",
        "topic": "",
        "x": 100,
        "y": 240,
        "wires": [
            [
                "9a481147.47bb2"
            ]
        ]
    },
    {
        "id": "9a481147.47bb2",
        "type": "change",
        "z": "da3e4843.e44578",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "textInput1",
                "pt": "flow",
                "to": "payload",
                "tot": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 370,
        "y": 240,
        "wires": [
            [
                "ef12cc40.85532"
            ]
        ]
    },
    {
        "id": "ef12cc40.85532",
        "type": "link out",
        "z": "da3e4843.e44578",
        "name": "",
        "links": [
            "16d8779a.6e20e8",
            "aa966c98.0fd6e",
            "b0c56eba.88147",
            "4f5a3d06.686674"
        ],
        "x": 535,
        "y": 240,
        "wires": []
    },
    {
        "id": "63a7122a.653c4c",
        "type": "ui_group",
        "z": "",
        "name": "TEST",
        "tab": "f5ae0649.7bda38",
        "disp": true,
        "width": "6",
        "collapse": false
    },
    {
        "id": "f5ae0649.7bda38",
        "type": "ui_tab",
        "z": "",
        "name": "TEST",
        "icon": "dashboard",
        "disabled": false,
        "hidden": false
    }
]

zenofmud · 7 January 2020 16:00

Why do you have a function node that just returns the msg it gets?
Remember each text node will send a seperate msg and the button will send a seperate msg.

add some debug nodes in so you can see what is happening

pvanklink · 7 January 2020 17:27

I know, i reserved this for combining the two values. problem is i dont know how to change this flow so that when i activate the button, it contains the state of the two textboxes so that this info can be used in a subflow that is already working with hardcoded values

zenofmud · 7 January 2020 19:01

Why note use a ui-form to input the text?

If you must use two inputs then you need to have some indicator so that when the button is pressed, you can check to see if both text inputs are finished before grabbing thier values to process.

I would get rid of the links off the two text nodes and set a 'filled' flag for each. The button would be connected to a node to check both are filled. If they are, it should display a message they are not filled in. If they are both filled, unfill them (for the next time) and grab the data you stored in the flow context from the text nodes and process it.

You might want to add a reset button too.

pvanklink · 7 January 2020 19:26

ui form does not have dropdowns...

and i also display feedback from subsroutines that are executed

zenofmud · 7 January 2020 19:28

You could always use the ui_template and roll your own form....

pvanklink · 7 January 2020 19:30

This is what i have now...

I can only use one button
and i can only use one select box

Trying_to_learn · 7 January 2020 19:53

My take - sorry haven't loaded the flow.

If you want "multiple outputs" from the button being pressed, why not do something like this:
(Basic idea only)

Screenshot from 2020-01-08 06-53-03

pvanklink · 7 January 2020 19:57

I want infact multiple inputs, different select/textboxes . after pushing the button it has to send all the values in one message to the subflow

Trying_to_learn · 7 January 2020 19:59

(Sorry. That isn't how I read the topic.)

I may have to look at your flow.

In the function node put this bit of code:

let a = flow.get('textInput1');
let b = flow.get('textInput2');

msg.payload = a + " " + b;

return msg;

That may be a starting point.

pvanklink · 7 January 2020 20:11

Thanks, that is indead a start!

Colin · 7 January 2020 20:32

You can use a Join node to combine the values from the ui elements. See this page in the cookbook for how to do it. That will save using flow context and having flow sections disconnected from each other so that it is not clear how one action initiates another.

pvanklink · 8 January 2020 14:59

thanks to all, got it working with the default dashboard node!

The trick for me was to use:
let a = flow.get('textInput1');
let b = flow.get('textInput2');
and then give these values to the subflow!

Only thing to do is when a textbox (list) is used another textbox should be hidden, is that possible?

pvanklink · 9 January 2020 12:01

hi @zenofmud,

i am busy to follow your lead and try to learn templating
I used the dashboard template, and indead much more flexibel!
Is there a way to align labels INFO and HISTORIE to the left?
I tried by adding align statement but that does not work.
For the rest i am making progress

<table style="width:100%">
  <tr layout-align="left">
    <th>INFO</th> 
  </tr>
  <tr>
    <td>{{msg.payload}}</td>
  </tr>
</table>

layout

zenofmud · 9 January 2020 12:06

Where did you come up with that syntax?? try googling 'html style'

pvanklink · 9 January 2020 12:33

I guess i google bad...
now it works!

<table style="width:100%">
  <tr>
    <th>
        <div align="left">
        INFO
        </div>
    </th> 
  </tr>
  <tr>
    <td>{{msg.payload}}</td>
  </tr>
</table>

Last part is to format the difficult parts (dropdown and switch and button).
Are there nodes available for this?

Topic		Replies	Views
Dashboard 2.0 with multiple inputs stored and prefilled with and from context storage Dashboard dashboard-2	3	64	26 September 2024
Trying to create a dashboard with a quantity, a dropdown and a button and get the data when button pushed Dashboard	3	252	12 July 2022
How to send multiple text inputs to a button and get their values in a function? Dashboard	1	1046	22 June 2020
Dashboard 2 - Gather data from multiple dropdowns on multi tenant dashboard Dashboard dashboard-2	8	114	24 July 2024
How to work with text input Dashboard	4	15206	15 August 2019

Dashboard that can send two or more values when button activates

Related topics