GWT CellTable Header Column with Filter does not accept space (keycode=32)

Question

I have created a custom CellTable header as described in this thread: CellTable with custom Header containing SearchBox and Focus Problem

To go around the focus problem, i use the change event instead of the keyup event to trigger the filtering, so filter is now triggered only when the filter box looses its focus or Enter key is pressed.

The only problem I encountered is the filter box does not accept spaces (keycode=32). Anyone experiencing this?

score 2 · Accepted Answer · answered May 04 '12 at 01:51

I had found out that the AbstractHasData class which is one of the parent classes of the CellTable uses SPACE, HOME, END, ARROW UP, and ARROW DOWN for table navigation, this prevents those keys to perform its default functionality on a cell.

The keyboard navigation is only suppressed when cellIsEditing is TRUE which only happens when a cell on the Table's body is in focus and on edit mode.

Unfortunately since CellTable originally does not support input boxes on the header, there is also no support for cellIsEditing on the header.

As a workaround, I had created a private field headerIsEditing in my own extension of the CellTable class, this by default is set to FALSE. Then I had overridden the onBrowserEvent2 method, to set headerIsEditing to TRUE when the filter input box is in focus and set it to FALSE when blur event for the same box happens.

Then I had overridden isKeyboardNavigationSuppressed as shown below:

@Override
protected boolean isKeyboardNavigationSuppressed() {
    return super.isKeyboardNavigationSuppressed() || headerIsEditing;
}

With this, keyboard navigation is suppressed when cellIsEditing is TRUE OR headerIsEditing is TRUE.

score 0 · Answer 2 · answered May 02 '12 at 07:47

0

An object of KeyUpEvent has the method getNativeEvent() from the class com.google.gwt.event.dom.client.DomEvent

Using it you should haven't any problems:

if (event.getNativeEvent().getKeyCode() == 32) { 
       // TODO
}

Likely the cause in some other place.

answered May 02 '12 at 07:47

kapandron

3,546
2
25
38

Thanks for the reply Andrey, yes I have tried that on the onBrowserEvent,but i can only do something like getinputElement.setvalue(getInputElement.getValue() + " "), which is just appending space on last text, but this is not always the case for instance I want to append the space where the cursor is positioned, unfortunately I don't have the cursor position which is only available in TextBox widget. Is there a way to get the cursor position in cells? – Edwin Bautista May 02 '12 at 08:19
Unfortunately, Cell Widgets don't implement method `setFocus()`. Maybe this can be achieved by using `selectionModel.setSelection()` and selecting the first item from the current range. – kapandron May 02 '12 at 09:46

score 0 · Answer 3 · answered May 03 '12 at 02:25

I was able to make a workaround for this problem, in the browser event as point out by Andrey, I had this code:

public void onBrowserEvent(Context context, Element parent, C value,
    NativeEvent event, ValueUpdater<C> valueUpdater) {
if (value == null) return;

String eventType = event.getType();

GWT.log(eventType);

super.onBrowserEvent(context, parent, value, event, valueUpdater);

InputElement input = getInputElement(parent);

if ("change".equals(eventType)) {
    ((HeaderFilterDto) value).setFilterValue(input.getValue());
    if (valueUpdater != null) valueUpdater.update(value);
} else if ("keyup".equals(eventType) && event.getKeyCode() == 32) {
    insertSpaceToCursorPosition(input);
}
};

And then I have this method to insert the SPACE in the cursor position:

protected void insertSpaceToCursorPosition(InputElement input) {
if (StringUtils.isNotBlank(input.getValue())) {
    int length = input.getValue().length();
    int pos = getCursorPos(input);
    int selected = getSelectionLength(input);

    String sub1 = input.getValue().substring(0, pos);
    String sub2 = input.getValue().substring(selected == 0 ? pos: pos + selected, length);

    input.setValue(sub1 + SPACE + sub2);

    setSelectionRange(input, pos);
} else {
    input.setValue(SPACE);
    setSelectionRange(input, 0);
}
}

The methods inside insertSpaceToCursorPosition were patterned from ValueBoxBase implementation of TextBoxImpl.class.

score 0 · Answer 4 · answered Oct 28 '15 at 13:36

I solved this problem fixing the KeyProvider passed to the CellTable.

This issue may happen if your KeyProvider is implemented based on fields that are null, which the com.google.gwt.cell.client.AbstractInputCell#isEditing returning false and then the SPACEBAR key is used as navigation cell.

GWT CellTable Header Column with Filter does not accept space (keycode=32)

4 Answers4