Examples with ComboBox com.vaadin.flow.component.combobox.ComboBox used on opensource projects

Example 16 with ComboBox

use of com.vaadin.flow.component.combobox.ComboBox in project flow-components by vaadin.

the class ComboBoxDemoPage method createComboBoxWithCallbackLazyLoading.

private void createComboBoxWithCallbackLazyLoading() {
    ComboBox<String> comboBox = new ComboBox<>();
    /*
         * This data provider doesn't load all the items to the server memory
         * right away. The component calls the first provided callback to fetch
         * items from the given range with the given filter. The second callback
         * should provide the number of items that match the query.
         */
    comboBox.setDataProvider((filter, offset, limit) -> IntStream.range(offset, offset + limit).mapToObj(i -> "Item " + i), filter -> 500);
    comboBox.setId("callback-box");
    add(new Div(new H2("Lazy Loading"), new H2("Lazy loading with callbacks"), comboBox));
}

Example 17 with ComboBox

use of com.vaadin.flow.component.combobox.ComboBox in project flow-components by vaadin.

the class ComboBoxDemoPage method createComboBoxWithCustomValues.

private void createComboBoxWithCustomValues() {
    Div message = createMessageDiv("custom-value-message");
    ComboBox<String> comboBox = new ComboBox<>("City");
    comboBox.setItems("Turku", "Berlin", "San Jose");
    /**
     * Allow users to enter a value which doesn't exist in the data set, and
     * set it as the value of the ComboBox.
     */
    comboBox.addCustomValueSetListener(event -> {
        comboBox.setValue(event.getDetail());
    });
    comboBox.addValueChangeListener(event -> {
        if (event.getSource().isEmpty()) {
            message.setText("No city selected");
        } else {
            message.setText("Selected city: " + event.getValue());
        }
    });
    comboBox.getStyle().set(ElementConstants.STYLE_WIDTH, WIDTH_STRING);
    comboBox.setId("custom-value-box");
    add(new Div(new H2("Custom Values"), new H2("Allow users to input custom values"), comboBox, message));
}

Example 18 with ComboBox

use of com.vaadin.flow.component.combobox.ComboBox in project flow-components by vaadin.

the class ComboBoxDemoPage method createStringComboBox.

private void createStringComboBox() {
    Div message = createMessageDiv("string-selection-message");
    ComboBox<String> comboBox = new ComboBox<>("Browsers");
    comboBox.setItems("Google Chrome", "Mozilla Firefox", "Opera", "Apple Safari", "Microsoft Edge");
    comboBox.addValueChangeListener(event -> {
        if (event.getSource().isEmpty()) {
            message.setText("No browser selected");
        } else {
            message.setText("Selected browser: " + event.getValue());
        }
    });
    comboBox.getStyle().set(ElementConstants.STYLE_WIDTH, WIDTH_STRING);
    comboBox.setId("string-selection-box");
    add(new Div(new H2("String selection"), comboBox, message));
}

Example 19 with ComboBox

use of com.vaadin.flow.component.combobox.ComboBox in project flow-components by vaadin.

the class ComboBoxDemoPage method createDisabledComboBox.

private void createDisabledComboBox() {
    Div message = createMessageDiv("disabled-combobox-message");
    ComboBox<String> comboBox = new ComboBox<>("Disabled ComboBox");
    comboBox.setEnabled(false);
    comboBox.setItems("Google Chrome", "Mozilla Firefox", "Opera", "Apple Safari", "Microsoft Edge");
    comboBox.addValueChangeListener(event -> {
        if (event.getSource().isEmpty()) {
            message.setText("No browser selected");
        } else {
            message.setText("Selected browser: " + event.getValue());
        }
    });
    comboBox.getStyle().set(ElementConstants.STYLE_WIDTH, WIDTH_STRING);
    comboBox.setId("disabled-combo-box");
    add(new Div(new H2("Disabled ComboBox"), comboBox, message));
}

Example 20 with ComboBox

use of com.vaadin.flow.component.combobox.ComboBox in project flow-components by vaadin.

the class ComboBoxPage method createWithUpdatableValue.

private void createWithUpdatableValue() {
    ComboBox<String> combo = new ComboBox<>();
    combo.setItems("Item 1", "Item 2", "Item 3");
    Label message = new Label();
    NativeButton button = new NativeButton("Update value", evt -> combo.setValue("Item 2"));
    combo.addValueChangeListener(event -> message.setText("Value: " + event.getValue() + " isFromClient: " + event.isFromClient()));
    combo.setId("updatable-combo");
    message.setId("updatable-combo-message");
    button.setId("updatable-combo-button");
    add(combo, message, button);
}