firefox - GWT Celtable : two clicks needed to change checkbox state in FireFox

Question

在我的项目中，我有带有 CheckBoxCell 列的 CellTable。这是表示(更改)值的常规列，不用于行选择(对于选择，我使用 SingleSelectionModel)。在 Chrome 中，一切正常，第一次单击时，我会更改复选框状态并选择行。在 FireFox 中，当我尝试单击 CheckBoxCell 列中的复选框时，GWT 选择行并在第二次单击复选框后更改复选框状态。但我需要与 Chrome 中相同的行为(第一次点击时更改复选框状态)。

这是我创建列的方法:

private <C> Column<T, C> addColumn(CellTable<T> itemListTable, Cell<C> cell, String headerText, int columnWidthPct, final IValueGetter<C, T> getter, @Nullable FieldUpdater<T, C> fieldUpdater) {
    Column<T, C> column = new Column<T, C>(cell) {
        @Override
        public C getValue(T object) {
            return getter.getValue(object);
        }
    };
    column.setFieldUpdater(fieldUpdater);
    column.setSortable(false);
    itemListTable.addColumn(column, headerText);
    itemListTable.setColumnWidth(column, columnWidthPct, PCT);
    return column;
}

private void generateExistingSettingsTable() {
    addColumn(existingSettingsTable, new ParameterizedCheckboxCell<T>(), IS_PUBLIC_HEADER, 10, new IValueGetter<Boolean, T>() {
                @Override
                public Boolean getValue(T setting) {
                    return setting.isPublic();
                }
            },
            new FieldUpdater<T, Boolean>() {
                @Override
                public void update(int index, T object, Boolean value) {
                    object.setPublic(value);
                    updatePublicState(object);
                }
            }
    );
}

我的 ParameterizedCheckboxCell 扩展了 CheckboxCell 并仅覆盖了渲染方法(以启用/禁用复选框输入)。

我已经尝试了此处建议的所有内容 here :

• stopPropagation 对我不起作用
• 将列添加到 DefaultSelectionEventManager 黑名单，这不是一个选项(复选框周围有很大的区域无法点击)

Answer 1

我今天发现，Chrome(版本 45.0.2454.101)也发生了同样的事情。我对此进行了更多调查并发现了以下内容。 GWT CheckboxCell默认情况下只消耗两个浏览器事件:keydown和 change .在旧版 Chrome 中，当您单击复选框时 change事件被触发，一切正常。在 FireFox 和新的 Chrome 版本中没有 change单击后的事件(我不明白为什么，欢迎解释)，所以我决定创建自己的扩展 AbstractEditableCell<Boolean, Boolean> 的复选框类并替换消耗的 change至 click事件。这是我得到的:

import java.util.Objects;

import com.google.gwt.cell.client.AbstractEditableCell;
import com.google.gwt.cell.client.ValueUpdater;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.InputElement;
import com.google.gwt.dom.client.NativeEvent;
import com.google.gwt.event.dom.client.KeyCodes;
import com.google.gwt.safehtml.shared.SafeHtmlBuilder;

import static com.google.gwt.dom.client.BrowserEvents.CLICK;
import static com.google.gwt.dom.client.BrowserEvents.KEYDOWN;

public class ParameterizedCheckboxCell extends AbstractEditableCell<Boolean, Boolean> {

    public ParameterizedCheckboxCell() {
        super(KEYDOWN, CLICK);
    }

    @Override
    public void render(Context context, Boolean value, SafeHtmlBuilder sb) {
        // Here i have some specific logic so i skip this part
        // You can just copy/paste body of this method from original CheckboxCell
    }

    @Override
    public void onBrowserEvent(Context context, Element parent, Boolean value, NativeEvent event, ValueUpdater<Boolean> valueUpdater) {
        final String type = event.getType();
        final boolean enterPressed = KEYDOWN.equals(type) && event.getKeyCode() == KeyCodes.KEY_ENTER;
        if (CLICK.equals(type) || enterPressed) {
            InputElement input = parent.getFirstChild().cast();
            Boolean isChecked = input.isChecked();

            if (enterPressed) {
                isChecked = !isChecked;
                input.setChecked(isChecked);
            }

            if (Objects.equals(value, isChecked)) {
                clearViewData(context.getKey());
            } else {
                setViewData(context.getKey(), isChecked);
            }
            valueUpdater.update(isChecked);
        }
    }

    @Override
    public boolean isEditing(Context context, Element parent, Boolean value) {
        return false;
    }

}

我跳过了 dependsOnSelection和 handlesSelection因为我不将其用于选择列。