Framework: Grid editor TextField does not allow whitespaces in unbuffered mode

[simon-chromow]

I am using the Grid with an unbuffered Editor.
The Grid has the default selection mode.

In a column I have a TextField as the EditorComponent.
In unbuffered mode it is not possible to enter whitespaces.
In buffered mode it is.
In unbuffered mode it is also possible if the selection mode is set to NONE

Vaadin Version: 8.3.0

[TatuLund]

What white space characters you are referring to? I am atleast able to enter normal spaces.

[simon-chromow]

Hi, for me normal spaces are not working.
Here is a little sample where the problem occurs.

package com.example.myapplication;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.annotation.WebServlet;

import com.vaadin.annotations.Theme;
import com.vaadin.annotations.VaadinServletConfiguration;
import com.vaadin.annotations.Widgetset;
import com.vaadin.data.Binder.Binding;
import com.vaadin.server.VaadinRequest;
import com.vaadin.server.VaadinServlet;
import com.vaadin.shared.ui.grid.HeightMode;
import com.vaadin.ui.CssLayout;
import com.vaadin.ui.Grid;
import com.vaadin.ui.TextField;
import com.vaadin.ui.UI;

@Theme("valo")
@Widgetset("com.example.AppWidgetset")
public class GridFailureUI extends UI {

    private static final String SUFFIX = "_SUFFIX";

    @Override
    protected void init(final VaadinRequest request) {
        buildLayout();
    }

    private void buildLayout() {
        final CssLayout root = new CssLayout(buildGrid());
        root.setSizeFull();
        setContent(root);
    }

    private Grid<CodeName> buildGrid() {
        final Grid<CodeName> grid = new Grid<>(CodeName.class);
        grid.removeAllColumns();
        grid.setHeightMode(HeightMode.CSS);
        grid.setHeight(100, Unit.PERCENTAGE);

        grid.getEditor().setEnabled(true);
        grid.getEditor().setBuffered(false);

        grid.addColumn(CodeName::getCode);
        grid.addColumn(item -> getName(item)).setId("suffixed_name");

        grid.setColumns("code", "suffixed_name");

        final TextField nameField = new TextField();
        final Binding<CodeName, String> binding = grid.getEditor().getBinder().forField(nameField).bind(this::getName, this::setName);
        grid.getColumn("suffixed_name").setEditorBinding(binding);

        final List<CodeName> codeNames = new ArrayList<>();
        codeNames.add(new CodeName("A"));
        codeNames.add(new CodeName("B"));
        codeNames.add(new CodeName("C"));
        grid.setItems(codeNames);
        return grid;
    }

    public String getName(final CodeName codeName) {
        if (codeName.getName() != null) {
            if (codeName.getName().endsWith(SUFFIX))
                return codeName.getName();
            else
                return codeName.getName() + SUFFIX;
                } else
            return null;
    }

    public void setName(final CodeName codeName, final String name) {
        codeName.setName(name);
    }

    public static class CodeName {
        private String  code;
        private String  name;

        public CodeName(final String code) {
            setCode(code);
        }

        public String getCode() {
            return code;
        }

        public void setCode(final String code) {
            this.code = code;
        }

        public String getName() {
            return name;
        }

        public void setName(final String name) {
            this.name = name;
        }
    }

    @WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)
    @VaadinServletConfiguration(ui = GridFailureUI.class, productionMode = false)
    public static class MyUIServlet extends VaadinServlet {
    }
}

[TatuLund]

I tested your code, and yes I can confirm the observation.

Earlier I tested this with my add-on's test app, and there it worked ok. You could try using the add-on and check if it is ok workaround for you:

https://vaadin.com/directory/component/gridfastnavigation-add-on

[fleahy]

I am also getting the same issue with space not allowed in the grid. It seems to be anywhere in the grid, either a filter field in the header or an edit field, and in unbuffered mode. This works fine in Vaadin 8.2.

[fleahy]

It is also happening with the GridFastNavigation add on, as long as the Vaadin version is >= 8.3 then it does not like to allow spaces in text fields in the grid. When running the GridFastNavigation demo app I see the following in the console when tap on the space key:

Selection event happens: Optional.empty

If I tap again then I see a different message:

Selection event happens: Optional[DemoColumns [col1=sdfsddddddddsedorjsldfskdfpo, col2=string 2 6, col3=15, col4=3.0, col5=12, col6=14, col7=Fri Mar 02 17:02:14 MST 2018, col8=Fri Mar 02 17:02:14 MST 2018, col10=false, col10=Medium, rand=java.util.Random@7a722520]]

Then it cycles back to the first message then second, etc.

[dusanskopik]

Hi,

I'm voting up for a quick fix on Vaadin side. Not being able to enter two words or a sentence into a text field component in UI framework sounds like an issue to me, major issue... :)

Cheers,
Dusan.

[TatuLund]

Yes, there is some odd regression regarding this one. I just checked that if you do grid.setSelectionMode(SelectionMode.NONE) then space can be used in text field.

[TatuLund]

This is maybe regression due this patch: https://github.com/vaadin/framework/pull/10388 The problem is that it catches the space and stops event propagation, hence space key press not caught by text field. The selection handling should check if editor is open and in case yes, it should not skip selection handling and let event propagate.

[dusanskopik]

Still not working in 8.3.2 version. Any plans to resolve this pressing issue soon?
Thanks.

[mcollovati]

I think the problem is not due to patch #10388; it was already present
in 8.2.1 and the example code works before 8.3.

My guess is that the issue was introduced by PR #10412 int this section

java // Don't handle event of child widget unless the column has been // explicitly permitted to do so if (grid.isElementInChildWidget(Element.as(target))) { Cell cell = container.getCell(target.cast()); if (cell != null) { Column<?, ?> column = grid .getVisibleColumn(cell.getColumn()); if (column == null || !column.isWidgetEventsAllowed()) { return; } } } doDispatch(handler, section);

The problem here is that when editor is open container.getCell(target.cast())
returns null because the TextField (target) is not a child of .v-grid-body
but it is in the hierarchy of .v-grid-editor unbuffered.
Giving this, probabily, doDispatch is invoked and SpaceSelectHandler stops the event.

[mcollovati]

Adding the following condition seems to work, but I'm not sure this is the correct way to go

...
if (cell != null) {
   ...
} else if (grid.isEditorActive() && grid.editor.getElementColumn(Element.as(target)) != -1) {
 return;
}

[dusanskopik]

Hi guys,

thanks for the effort. Would this work for text fields in header and footer cells as well? No editor open. Being still in Grid, the space event wouldn't get, by my opinion, propagated to the text field as well.

Thanks.
Cheers,
Dusan.

[TatuLund]

@dusanskopik That part should be fixed by this: https://github.com/vaadin/framework/pull/10720

[dusanskopik]

Hi,

Thanks, guys! Tested on 8.3.3 and all problems are gone.

Cheers,
Dusan.