GWT DataGrid：同时使用CheckboxCell-selection和标准行模式选择

Question

我正在使用带有 MultiSelectionModel 的 GWT DataGrid。

网格项的select离子应通过

实现

a) 带有 CheckboxCell

的 CheckboxColumn

同时

b) 标准线模式selection-model（通过点击线的其余部分）。

使用 CheckboxColumn，用户应该能够多 select 不同的条目。但是当点击数据网格线上的其他地方时，应该执行单行-select离子策略，这意味着，如果在使用复选框之前完成了多select离子，这个select离子应该被重置，只有被点击的行应该被select编辑。

这就是我的。有谁知道如何同时启用 CheckBox-Mode 和 line-selection-mode？

public class JobDataGrid extends DataGrid<Job>
{
    private MultiSelectionModel<Job> selectionModel;

    private Column<Job, Boolean> checkboxColumn;
    private TextColumn<Job> idColumn;
    private TextColumn<Job> titleColumn;
    private TextColumn<Job> timestampColumn;
    private TexTColumn<Job> ...

    public JobDataGrid ()
    {
        super ();

        checkboxColumn = new Column<Job, Boolean> (new CheckboxCell (true, false)) {
            @Override
            public Boolean getValue (Job job)
            {
                // Get the value from the selection model.
                return selectionModel.isSelected (job);
            }
        };
        checkboxColumn.setFieldUpdater (new FieldUpdater<Job, Boolean> () {
            public void update (int index, Job job, Boolean value)
            {
                // Called when the user clicks on a checkbox.
                selectionModel.setSelected (job, value);
            }
        });

        // [...]
        // [...]
        // [...]

        selectionModel = new MultiSelectionModel<Job> ();
        setSelectionModel (selectionModel); 
        // setKeyboardSelectionPolicy (KeyboardSelectionPolicy.DISABLED);

        // [...]
        // [...]
        // [...]
    }
}

我已经尝试了所有 4 种变体

new CheckboxCell (false, false);
new CheckboxCell (true, false);
new CheckboxCell (false, true);
new CheckboxCell (true, true);

但其中 none 显示了我所需要的。我也玩过

setSelectionModel (selectionModel, DefaultSelectionEventManager.<Job> createCheckboxManager ());

也许

createCustomManager(DefaultSelectionEventManager.EventTranslator<T> translator)

会有帮助吗？

谢谢托马斯

Answer 1

您可以创建自己的 "checkbox manager" 并在那里做您想做的事。

table.setSelectionModel(selectModel, DefaultSelectionEventManager.<DocumentListItemDTO> createCustomManager(
            new DefaultSelectionEventManager.CheckboxEventTranslator<DocumentListItemDTO>() {
                @Override
                public SelectAction translateSelectionEvent(CellPreviewEvent<DocumentListItemDTO> event) {
                    SelectAction action = super.translateSelectionEvent(event);
                    if (action.equals(SelectAction.IGNORE)) {

                        if (!event.getNativeEvent().getCtrlKey() && !event.getNativeEvent().getShiftKey())
                            selectionModel.clear();

                        return SelectAction.TOGGLE;

                    }
                    return action;
                }
            }));

Answer 2

方向对了！

为了展示 DefaultSelectionEventManager.CheckboxEventTranslator 的用法，在网络上几乎找不到示例，这里是一个功能齐全的解决方案：

setSelectionModel (selectionModel, DefaultSelectionEventManager.<Job> createCustomManager (
        new DefaultSelectionEventManager.CheckboxEventTranslator<Job> () {

            @Override
            public SelectAction translateSelectionEvent (CellPreviewEvent<Job> event)
            {
                NativeEvent nativeEvent = event.getNativeEvent ();

                // Determine if we clicked on a checkbox.
                Element target = nativeEvent.getEventTarget ().cast ();
                if ("input".equals (target.getTagName ().toLowerCase (Locale.ROOT)))
                {
                    final InputElement input = target.cast ();
                    if ("checkbox".equals (input.getType ().toLowerCase (Locale.ROOT)))
                    {
                        // Synchronize the checkbox with the current selection state.
                        input.setChecked (event.getDisplay ().getSelectionModel ().isSelected (
                                event.getValue ()));
                        return SelectAction.TOGGLE;
                    }
                }
                else
                {
                    if (BrowserEvents.CLICK.equals (nativeEvent.getType ()))
                    {
                        selectionModel.clear ();
                        return SelectAction.SELECT;
                    }
                }
                return SelectAction.IGNORE;
            }
        }));

GWT DataGrid：同时使用CheckboxCell-selection和标准行模式选择

GWT DataGrid: use of CheckboxCell-selection and standard line mode selection at the same time

gwt