ComboBox

Flow
1

Hi,

I try to achieve the following behaviour:

  • After selecting an item in the combobox I get a ValueChangedEvent. In this event the combobox should be cleared to be ready for the next input. How do I clear the box?

  • When the user enters a new text which is not represented in the item list and presses the enter key, then the value should be received by the server and the combobox should be cleared. I have registered a callback

      combo.getElement().addEventListener("keyup", e -> {
  }).addEventData("element.value").setFilter("event.keyCode == 13");

How do I get the text value of the input?

Thanks,
Andreas

2

How do I clear the box?

Try combo.setValue("");

How do I get the text value of the input?

Try combo.setAllowCustomvalue(true). Otherwise the combo box will clear/revert the value if you enter a value which is not in the items array/list.

3

Here’s what I tested for this problem:

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

    public MainView(@Autowired ExampleTemplate template) {
        VerticalLayout output = new VerticalLayout(new Span("Output:"));
        output.setSpacing(false);
        ComboBox<String> combo = new ComboBox<>("Add item", "", "Foo", "Bar", "Baz");
        combo.addValueChangeListener(e -> {
            output.add(new Span(e.getValue()));
            combo.clear();
        });
        combo.addCustomValueSetListener(e -> {
            output.add(new Span(e.getDetail()));
            combo.clear();
        });
        add(combo, output);
    }
}

It has however two problems

  1. addCustomValueSetListener works with Enter as suggested, but it gets also triggered by blur.
  2. clear() does not work in either of tha cases, and they do different things in both cases. I will ask around if I can get any more info on this.
4

When I call setValue("") I get

java.lang.IllegalArgumentException: The provided value is not part of ComboBox:

although combo.setAllowCustomvalue(true) is set.

Having a look at the code revealed that setValue() tries to lookup the value in the items list regardless if AllowCustomValue is set or not.

5

I have updated to the latest version of Flow.

The clear still doesn’t work. When I call clear the index is entered into the edit line.

6

Hi all,

Is the getDetail() method deprecated or is there something that I am missing? I cannot call it. Maximum I can use the toString(), but that doesn’t do the trick for me as it returns a long string that is not readable for the end user. Does anybody know how to get around this?

Thank you :slight_smile: