Issue using MultiselectComboBox within Dialog.

[matteocona]

Hi Goran,
how are you? :)

Your multiselect is amazing and works pretty well :)
I have found the following issue:
items are not displayed if the multiselect is placed into a dialog.

I attach a simple test app and two screenshots.
The test app compare the behavior of the combo box and the multiselect combo box (both into dialogs).

Let me know if you need something more.
Thank you in advance :)
Matteo

test-multisel-dialog.zip

[gatanaso]

Hi @matteocona,

Thanks for reporting this issue and providing a reproducible example. I believe it's related to the shadow dom not being initialized when the component is used in a dialog. Will need some time to further investigate and find a way to resolve this issue.

[matteocona]

Thank you very much,
Matteo

[gatanaso]

Hi @matteocona,

Could you please test with the following version: 2.4.2 and let me know if it works?

BR,
Goran

[matteocona]

Hi Goran,
sorry for the late reply.
It works.
Tested.

multiselect-combo-box-flow
version 2.5.0.rc1

vaadin version
14.2.0

Thanks a lot
Matteo

[matteocona]

Hi Goran,
have you tried the component within a dialog also for Vaadin 14.1.x?

Thank you very much
Matteo

[gatanaso]

Hi @matteocona,

I cannot recall at this time :) Are there any issues when using Vaadin 14.1.x ?

[mvysny]

Hi @gatanaso unfortunately the component is not initialized properly when it is initially invisible within the dialog (sorry :-) ). The following code demoes the issue:

@Route("")
public class MainView extends VerticalLayout {

    public MainView() {
        Button button = new Button("Click",
                e ->  {
                    final Dialog dlg = new Dialog();
                    final MultiselectComboBox<String> cb = new MultiselectComboBox<>("Hi Goran", "Really", "Sorry", "For", "Finding", "Bugs", ":-)");
                    cb.setVisible(false);
                    dlg.add(cb);
                    dlg.add(new Button("Show", a -> cb.setVisible(true)));
                    dlg.open();
                });

        add(button);
    }
}

Using Maven multiselect-combo-box-flow:2.5.0.rc1 which uses [email protected]

Should I file this a new bug please?

[gatanaso]

Hi @mvysny,

Thanks for the comment and the reproducible steps. Yes, there is already a ticket about this issue: #56

Until I resolve it, you can try to workaround it by wrapping the component in a Div and changing its visibility (as it is suggested in the ticket).

[mvysny]

Thank you :) At first I thought it to be a Dialog-related issue, but it's really a visibility-related issue. I'll wrap the component with div as you suggest.

[Sryther]

Hi, I could not achieve to display the multiselect like it did before the vaadin 14 upgrade. It worked in the past and since I updated and switched to Material theme I had no luck with it.
I'm in the same situation: the combobox in a dialog.

This a sample of my code:

MultiselectComboBox<XX> multiselectComboBox = new MultiselectComboBox<>("", XX.values());
multiselectComboBox.setValue(XX.Y);

Dialog dialog = new Dialog();
dialog.add(multiselectComboBox);

// Prepare the button that displays the multi statuses filter.
Button button = new Button(new Icon(VaadinIcon.FILTER), event -> {
    dialog.open()
});

When I click on the button, I have the (TypeError) : $0.$connector is undefined error and (TypeError) : window.Vaadin.Flow.multiselectComboBoxConnector is undefined.

I'm using Maven:

<dependency>
	<groupId>org.vaadin.gatanaso</groupId>
	<artifactId>multiselect-combo-box-flow</artifactId>
	<version>2.4.2</version>
</dependency>

Any ideas?

By the way, thank you very much for this component, it did save a lot of time :).

EDIT: I tried to use a wrapper element as suggested (div) but it didn't work for me.

[gatanaso]

@Sryther Thanks for the feedback, I really appreciate it.

Regarding your issue, it looks same as the one that was opened here originally. Might be then that something has changed in the way Vaadin initialises the dialog. Which version did you upgrade to, have you tried with another one perhaps?

Also, in the spirit of keeping things a bit more organised, I'd kindly ask if you can open a new issue and we continue the discussion there.

Thanks