vaadinvaadin-flowvaadin14

Vaadin Accordion with Button in summary

In my Vaadin 14 app, I want to add an Accordion component that has several components in its summary (which is always displayed), among which a Button. Clicking in the summary normally toggles the display of the AccordionPanel content. How can I prevent the AccordionPanel to collapse/expand when the button in the summary is clicked?

Objects are created simply as follows:

Accordion accordion = new Accordion();

MyPanel panel = new MyPanel();

accordion.add(panel);

with MyPanel constructor simply calling setSummary() with a layout containing the button.

Solution

  • I found the answer in this thread on the forum.

    It turns out you can prevent the propagation of the button click with this hack:

    button.getElement().addEventListener("click", click -> {
        //do nothing
}).addEventData("event.stopPropagation()");

    This seems like a core functionality that the framework should provide out of the box, but this ticket is still open.