Is there has any way to make node-html quickly？

Developing Nodes
,
1

Thanks for Node-red team first.

I'm new here, and trying to find some way to create node's ui quickly and simple.

DashBoard and UIbuilder are useful, but they are better suited for making individual businesses or products and not for making the forms needed for node parameters.

In other workflow open-source, it support declarative-style node which can use json to design UI form.

Is node-red has any way to do this?

2

Dashboard can create forms very simply with no code but you need to define it via nodes in your flow so not declarative in the traditional sense.

uibuilder now has a declaritive feature but this is at a somewhat lower level. It allows you to define your UI by declaring it using JSON.

Using the modern front-end client (Dynamic data-driven html)

3

Hi @Nash-x9

Just to clarify, I think you mean the node edit dialogs?

Dashboard/Ui-Builder are for creating dashboards from your flows - not individual node edit dialogs.

Assuming I've got that right, then we don't have this today but it is something that has come up a few times.

For simple edit dialogs that are essentially editors for key/value pairs of node properties, we should find a way to make that easier to do. We already have a bunch of code for generating node edit forms for subflows - finding a way to allow a regular node to do the same would be valuable to have.

Nick

2 Likes
4

I think it'd be useful as an extension of the registerType method, something like registerTypeWithHTML that accepts extended defaults attributes beyond value and validate, to add types, helpText, validationMsg and maybe a section for grouping attributes.

Something to look into in the future for sure, so I've bookmarked this for later!

5

@knolleary Thks for reply.
You are right, your guess is the same as I expressed.

As a low code platform,the node edit dialogs should easy and low code to create.

In particular, it can only be created by native HTML and JavaScript now, and this way there is no convenient generation of edit dialogs like VUE, which supports v-if, for, v-model, etc.

For example, if I need to create a form, the Input of the form needs to change dynamically according to the value of Select, currently I can only write a lot of if and style change to control dom show in JavaScript.

6

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