CODEWITHSUNDEEP
javavaadin
user12106967
user12106967

Reputation:

Removing added buttons Vaadin

I have one button in place. For each number a user sets in a text field, the appropriate number of buttons adds to the ui. But for every change of number i want all the buttonAdded to be removed, but not the first one, that is already in place. How do i do that? It didn't work when i tried it like in the exmaple:

final int number = Integer.parseInt(this.textField.getValue());
    if(number > 1) {
        for(int i = 1; i < number; i++) {
            final XdevButton buttonAdded = new XdevButton("Button " + i);
            this.verticalLayout.removeComponent(buttonAdded);
            this.verticalLayout.addComponent(buttonAdded);
        }
    }

Is there a way to create new buttons with a defined component name in my loop? Something like this:XdevButton button + i = new XdevButton()?

Edit:(Tried it with a list) - doesn't work.

private void textField_valueChange(final Property.ValueChangeEvent event) {

    final int number = Integer.parseInt(this.textField.getValue());
    final List<XdevButton> addedButtons = new LinkedList<>();
    for(final XdevButton btn : addedButtons) {
        this.verticalLayout.removeComponent(btn);
    }
    addedButtons.clear();

    if(number > 1) {

        for(int i = 1; i < number; i++) {
            final XdevButton buttonAdded = new XdevButton("Button " + i);
            addedButtons.add(buttonAdded);
            for(final XdevButton btn : addedButtons) {
                this.verticalLayout.addComponent(btn);
            }
        }
    }
}

What am i missing?

Upvotes: 0

Views: 122

Answers (2)

Erik Lumme
Erik Lumme

Reputation: 5352

That indeed won't work, nor is it possible to name a button the way you are asking.

You have a few options, if you don't want to reuse the old buttons.

If the vertical layout only contains buttons, or if you know how many components there are before the buttons, you can remove them by index:

for(int i = 1; i < number; i++) {
    this.verticalLayout.getElement().removeChild(i);
}

You can also create a list or other collection to keep track of the buttons, this way you can reuse them as well:

private List<Button> buttons = new LinkedList<>();

...

    // Not enough buttons, need to add new ones
    if (number > buttons.size()) {
        for(int i = buttons.size(); i < number; i++) {
            Button buttonAdded = new Button("Button " + i);
            buttons.add(buttonAdded);
        }
    }
    // Too many buttons, remove the extras
    else if (buttons.size() > number) {
        List<Button> buttonsToRemove = buttons.subList(number, buttons.size());
        buttonsToRemove.forEach(verticalLayout::remove);
        buttonsToRemove.clear();
    }

Upvotes: 1

anasmi
anasmi

Reputation: 2652

I would create a separate layout holder for buttons to be removed/added and work with it. For testing purposes I've replaced your XdevButton with a general Vaadin Button class. This seems to work according to your specs: 

@Route("customView")
public class CustomView extends VerticalLayout {
    VerticalLayout buttonHolder=new VerticalLayout();

    public CustomView (){
        TextField tf=new TextField("Enter amount of buttons");
        tf.addValueChangeListener(event->{
            final int number = Integer.parseInt(event.getValue());
            if(number > 1) {
                buttonHolder.removeAll();
                for(int i = 0; i < number; i++) {
                    final Button buttonAdded = new Button("Button " + i);
                    buttonHolder.add(buttonAdded);
                }
            }
        });
        Button alwaysInPlace=new Button("This button is never removed");
        add(alwaysInPlace);
        add(buttonHolder);
    }
}

Example is created in V14, but should be similar in all other versions

Upvotes: 1

Related Questions