Looking for really simple example of editableList

Developing Nodes
1

Can anyone point me to a really simple example of the use of editableList? I am trying to use it to create an array of simple objects, each consisting of a couple of numbers and a string. I am looking at the code for the switch node but I am struggling to see the wood for the trees as most of the code is to do with the complexities of the data rather than the list itself, and I have little experience in the html area.

2

I don't know if this will be clear to you but I did this if you're interested.

[EDIT]: I have a simpler example here.

3

That has confused me further, as it seems to be handling it in a different way to that in, for example, the switch node. It is specifically oneditprepare() where I am having problems with understanding what I need to do.

4

Looking through the core code, I think the ActionList dropdown includes one of the more straight-forward uses of editableList:

  1. You create an <ol> element, convert it to an editableList.
  2. in the config for the list, you provide an addItem function that is called whenever there is an item to add to the list. It is provided a container which is the parent DOM element for the item, along with the data item itself. It's then over to you to create the list item's DOM representation inside container.

There are a number of configuration options and functionality around sorting and filtering. All documented here EditableList Widget : Node-RED, albeit without an end-to-end example to help get started..

5

Thanks, I will have a look.

6

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