Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ui-form: Adding a dropdown with options dynamically doesn't work #1256

Closed
its-Zeke opened this issue Sep 2, 2024 · 4 comments
Closed

ui-form: Adding a dropdown with options dynamically doesn't work #1256

its-Zeke opened this issue Sep 2, 2024 · 4 comments
Labels
bug Something isn't working needs-triage Needs looking at to decide what to do

Comments

@its-Zeke
Copy link

its-Zeke commented Sep 2, 2024

Current Behavior

I'm adding some text input fields, date picker and a dropdown to a ui-form by passing the stuff to 'msg.ui_update.options'.
After that i'm trying to add entries to the dropdown by setting this: 'msg.ui_update.dropdownOptions'.

image

My options are never appearing in the dashboard.

image

Also the documentation at https://dashboard.flowfuse.com/nodes/widgets/ui-form.html is a little confusing. On the upper part it says in the structure to set: Array<{ dropdown: , key: , label: }> but then in the example we have: [{
"dropdown": "Dropdown Name",
"value": "1",
"label": "Option 1"
}]

Expected Behavior

I expected to add 4 fields to the ui-form node, 1 of them is a dropdown. I also expected, to set the dropdown entries by passing them to dropdownOptions.

Steps To Reproduce

Here's the mini flow:

[
    {
        "id": "66bf77559901ee4d",
        "type": "ui-form",
        "z": "aa8e63720407f4a8",
        "name": "",
        "group": "c0d504cf5fe801b7",
        "label": "Neuer Eintritt",
        "order": 1,
        "width": 0,
        "height": 0,
        "options": [
            {
                "label": "Name",
                "key": "name",
                "type": "text",
                "required": true,
                "rows": null
            }
        ],
        "formValue": {
            "name": ""
        },
        "payload": "",
        "submit": "submit",
        "cancel": "clear",
        "resetOnSubmit": true,
        "topic": "topic",
        "topicType": "msg",
        "splitLayout": "",
        "className": "",
        "passthru": false,
        "x": 810,
        "y": 500,
        "wires": [
            [
                "879efe0af9720da1"
            ]
        ]
    },
    {
        "id": "1635bc4840179702",
        "type": "inject",
        "z": "aa8e63720407f4a8",
        "name": "",
        "props": [
            {
                "p": "ui_update",
                "v": "{}",
                "vt": "json"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": true,
        "onceDelay": 0.1,
        "topic": "",
        "x": 430,
        "y": 500,
        "wires": [
            [
                "d8aacea1bc33d051"
            ]
        ]
    },
    {
        "id": "d8aacea1bc33d051",
        "type": "function",
        "z": "aa8e63720407f4a8",
        "name": "function 20",
        "func": "msg.ui_update.options = [\n    {\n        \"type\": \"text\",\n        \"label\": \"Name\",\n        \"key\": \"name\",\n        \"required\": true\n    },\n    {\n        \"type\": \"text\",\n        \"label\": \"Vorname\",\n        \"key\": \"firstName\",\n        \"required\": true\n    },\n    {\n        \"type\": \"date\",\n        \"label\": \"Geburtstag\",\n        \"key\": \"dob\",\n        \"required\": true\n    },\n    {\n        \"type\": \"dropdown\",\n        \"label\": \"Mannschaft\",\n        \"key\": \"teamSelect\",\n        \"required\": true\n    }\n]\n\nmsg.ui_update.dropdownOptions =\n    [{\n        \"dropdown\": \"teamSelect\",\n        \"value\": \"1\",\n        \"label\": \"Option 1\"\n    }]\n\nreturn msg;",
        "outputs": 1,
        "timeout": 0,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 610,
        "y": 500,
        "wires": [
            [
                "66bf77559901ee4d",
                "58dc41bec0ad2a4a"
            ]
        ]
    },
    {
        "id": "879efe0af9720da1",
        "type": "debug",
        "z": "aa8e63720407f4a8",
        "name": "debug 26",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "statusVal": "",
        "statusType": "auto",
        "x": 1020,
        "y": 500,
        "wires": []
    },
    {
        "id": "c0d504cf5fe801b7",
        "type": "ui-group",
        "name": "Eintritt",
        "page": "588400228cd2e224",
        "width": "6",
        "height": "1",
        "order": 1,
        "showTitle": true,
        "className": "",
        "visible": "true",
        "disabled": "false"
    },
    {
        "id": "588400228cd2e224",
        "type": "ui-page",
        "name": "Prozess",
        "ui": "81e89166e9abaa16",
        "path": "/page2",
        "icon": "home",
        "layout": "grid",
        "theme": "cf440ef319098fbf",
        "order": 1,
        "className": "",
        "visible": "true",
        "disabled": "false"
    },
    {
        "id": "81e89166e9abaa16",
        "type": "ui-base",
        "name": "My Dashboard",
        "path": "/dashboard",
        "includeClientData": true,
        "acceptsClientConfig": [
            "ui-notification",
            "ui-control"
        ],
        "showPathInSidebar": false,
        "showPageTitle": true,
        "navigationStyle": "default",
        "titleBarStyle": "default"
    },
    {
        "id": "cf440ef319098fbf",
        "type": "ui-theme",
        "name": "Default Theme",
        "colors": {
            "surface": "#ffffff",
            "primary": "#0094CE",
            "bgPage": "#eeeeee",
            "groupBg": "#ffffff",
            "groupOutline": "#cccccc"
        },
        "sizes": {
            "density": "default",
            "pagePadding": "12px",
            "groupGap": "12px",
            "groupBorderRadius": "4px",
            "widgetGap": "12px"
        }
    }
]

Environment

  • Dashboard version: 1.15.0
  • Node-RED version: 4.0.0
  • Node.js version: 20.15.0
  • npm version: 10.7.0
  • Platform/OS: windows
  • Browser: chrome

Have you provided an initial effort estimate for this issue?

I have provided an initial effort estimate

@its-Zeke its-Zeke added bug Something isn't working needs-triage Needs looking at to decide what to do labels Sep 2, 2024
@joepavitt
Copy link
Collaborator

Ah, you've jumped the gun a little! That got merged into our main branch on Friday, but isn't actually released yet.

@gayanSandamal @Steve-Mcl could you push out a 1.15.1 please

@gayanSandamal
Copy link
Contributor

Ah, you've jumped the gun a little! That got merged into our main branch on Friday, but isn't actually released yet.

@gayanSandamal @Steve-Mcl could you push out a 1.15.1 please

We will handle this

@gayanSandamal gayanSandamal mentioned this issue Sep 2, 2024
10 tasks
@Steve-Mcl
Copy link
Contributor

Steve-Mcl commented Sep 2, 2024

Ah, you've jumped the gun a little! That got merged into our main branch on Friday, but isn't actually released yet.

@gayanSandamal @Steve-Mcl could you push out a 1.15.1 please

@joepavitt apologies, I am just seeing this now.

I put a comment on the issue: #1257 (comment)

Essentially, I am thinking the should not really be a .1 patch release? (as I can see a whole bunch of features in the commit log since v1.15.0)

@Steve-Mcl
Copy link
Contributor

v1.16.0 is now released.

closing issue.

If problems persist, re-open or start new issue.

Thanks.

@github-project-automation github-project-automation bot moved this from Backlog to Done in Dashboard Backlog Sep 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working needs-triage Needs looking at to decide what to do
Projects
Status: Done
Development

No branches or pull requests

4 participants