Focus/cursor in grid item editor with non-editable columns

Vaadin 6 / 7 / 8
1

Hi,

I use the grid item editor with some non-editable columns:

[code]
public class TestUI extends UI {
@Override
protected void init(final VaadinRequest request) {
final Grid grid = new Grid();
grid.setSizeFull();
grid.setEditorEnabled(true);

    grid.addColumn("non-editable-1", String.class).setEditable(false);
    grid.addColumn("editable-2", String.class);
    grid.addColumn("non-editable-3", String.class).setEditable(false);
    grid.addColumn("editable-4", String.class);

    grid.addRow("non-editable-1", "editable-2", "non-editable-3", "editable-4");
    grid.editItem(grid.getContainerDataSource().firstItemId());

    setContent(grid);
}

}
[/code]In the above example, I perceive the following behaviour concerning the focus/cursor:

  2. The focus/cursor can be set to a non-editable column. This happens for the first column, when
    the item editor is opened and for the third column when clicking in the editor cell or when using the tab key.
  3. In non-editable columns, there is no visual indication, where the focus/cursor is.
  4. When using Firefox, typing in a non-editable editor cell, opens the browser’s search bar.

I use Vaadin 7.6.1.

Is this a bug?

Is there a work-around?

At least for the 2nd behavior described?

Best regards,
Winfried

2

One bad work around (which solves the above problems 2 and 3) is to use a “setEditorField(new ReadOnlyField())” instead of “setEditable(false)”:

[code]
public static class ReadOnlyField extends TextField {
public ReadOnlyField() {
super();
setStyleName(“read-only-field”);
setMaxLength(0);
setNullRepresentation(“”);
}

    @Override
    protected void setInternalValue(final @Nullable String newValue) {
        // Never show value, to prohibit editing (additionally to setMaxLength(0))
    }
}

@Override
protected void init(final VaadinRequest request) {
    final Grid grid = new Grid();
    grid.setSizeFull();
    grid.setEditorEnabled(true);

    grid.addColumn("non-editable-1", String.class).setEditorField(new ReadOnlyField());
    grid.addColumn("editable-2", String.class);
    grid.addColumn("non-editable-3", String.class).setEditorField(new ReadOnlyField());
    grid.addColumn("editable-4", String.class);

    grid.addRow("non-editable-1", "editable-2", "non-editable-3", "editable-4");
    grid.editItem(grid.getContainerDataSource().firstItemId());

    setContent(grid);
}

style.scss:
.v-grid-editor .v-grid-editor-cells .read-only-field {
background: $v-background-color;
}
[/code]ReadOnlyField sets the max length of the textfield to 0 which prohibits editing, if the textfield does never show the value of the cell. setReadOnly(false) did not work, because the cursor is not shown.