Problem with editableList resize callback

Developing Nodes
1

Should the resize() callback on editableList be called when I click the Add row button, or the x to remove a row? I am only seeing it getting called when I initially open the dialog.

Using 4.0.0 beta 3

2

Hi @Colin,

I use the editableList quite a bit.
This is what I do, and seems to work well.

  1. My Target element
    <div>
	  <ol id="filtersets" style="min-height:450px;min-width:400px"> </ol>
    </div>
  1. Instance Creation (oneditprepare)
$('#filtersets').editableList({
    header: $('<div>').append(
        '<div>Filter Sets - order defines outputs</div>'
    ),
    sortable: true,
    removable: true,
    addButton: 'Add Filter Set',
    addItem: AddItem,
    sortItems: SortItems,
    removeItem: RemoveItem
});
  1. oneditresize
oneditresize: function (size) {
   $('#filtersets').editableList('height', size.height - 70);
}

I increase the height of each item when it has focus.

Screenshot 2024-05-25 at 16.00.35
Screenshot 2024-05-25 at 16.00.35650Ă—765 41.4 KB

I should note : I don't use the BETA

3

Is that for when the dialog is resized? That isn't what I am trying to trap, I want to know when the number of rows in the list changes. The docs say
'A function that gets called when the size of the list changes.'
Which I took to mean that the number of rows has changed. It doesn't appear to get called when I resize the dialog.

4

Ah I see.

I don't 'react' if that is right word during addition (at least I don't do anything with the number of items at that point).

I could be wrong - but addItem is the call back used when the number of items are being added to and removeItem for when one is removed.

You could (if resize isn't the event used for this) count the items inside these events?

const itemCount = $('#filtersets').editableList('items').length

Have never used resize myself, so it may be of use for you, but have never used it myself.

I wonder if the resize event is when the initial Dom element is sized up / or modified later by user code :man_shrugging:

5

I am currently doing what I need in addItem and removeItem, but it would save code if I could do it in resize. It would be good to know whether this does work in version 3, in case it is a bug in the beta. I haven't got a non-beta version I can play with at the moment.

6

Does resizeItem work for you?

it appears this is should be called when the collection has changed?
this is followed by resize

A function that gets called against each item in the list when the size of the list changes.

https://nodered.org/docs/api/ui/editableList/#options-resizeItem

EDIT Let me test resize....

7

@Colin

Ok...

It ONLY gets called during init (NOT after an item is added/removed)
Node RED : 3.1.9

8

Thanks for confirming the problem. I have submitted an issue.

1 Like
9

As noted in the linked issue, the docs are at least ambiguous, if not misleading. In fact you were correct, it is a change in the physical size of the list element that invokes the callback, not the size (length) of the list itself.

1 Like
10

Indeed seems to be the case.
Appears to require the docs in this area to be better explained?

11

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