Question

我有一个页面使用GXT 2.2.5和GWT 2.4.0来生成包含多选列表的表单。当用户选择一个项目时，移动+点击另一个项目而不滚动它按预期工作。但是，当他们选择一个项目时，滚动以便所选项目不再可见，然后按住+单击另一个项目，不选择任何项目。看起来整个列表都被选中，然后取消选择。

我能够使用Chrome 36和IE 9中的简化代码重现这一点。

public class SimpleMultiSelectView implements WidgetFactory {

    public Widget buildWidget(String userName, Entry entry) {

        final Viewport viewport = new Viewport();
        final FormData formData = new FormData("-10");

        ListStore<ModelData> store = new ListStore();
        for (int i = 1; i< 50; i++) {
            ModelData modelData = new BaseModel();
            modelData.set("id", i);
            modelData.set("display", "Test " + i);
            store.add(modelData);
        }

        ListField<ModelData> selectionBox = new ListField<ModelData>();
        selectionBox.setStore(store);
        selectionBox.setDisplayField("display");
        selectionBox.setFieldLabel("display");
        selectionBox.setWidth(300);
        selectionBox.setHeight(300);

        LayoutContainer workFlowSearch = new LayoutContainer();    
        workFlowSearch.add(selectionBox, formData);

        viewport.add(workFlowSearch);

        return viewport;
    }
}

重现问题：

选择列表中的任何项目
滚动以便所选项目不再可见
按住SHIFT键并选择任何项目
看到没有选择任何内容

有没有人见过这个？我该怎么做才能改变行为？

备注

我确实尝试将项目更新为GXT 3.1.0和GWT 2.6.1，但它似乎没有什么区别。

我还将这个HTML放在一起进行健全检查

<html>
    <body>    
        <form action="">
            <select name="selection" multiple style="height: 200px; width: 125px">
                <option value="Option 1">Option 1</option>
                <option value="Option 2">Option 2</option>
                <option value="Option 3">Option 3</option>
                <option value="Option 4">Option 4</option>
                <option value="Option 5">Option 5</option>
                <option value="Option 6">Option 6</option>
                <option value="Option 7">Option 7</option>
                <option value="Option 8">Option 8</option>
                <option value="Option 9">Option 9</option>
                <option value="Option 10">Option 10</option>
                <option value="Option 11">Option 11</option>
                <option value="Option 12">Option 12</option>
                <option value="Option 13">Option 13</option>
                <option value="Option 14">Option 14</option>
                <option value="Option 15">Option 15</option>
                <option value="Option 16">Option 16</option>
                <option value="Option 17">Option 17</option>
                <option value="Option 18">Option 18</option>
                <option value="Option 19">Option 19</option>
            </select>
            <input type="submit">
        </form>    
    </body>
</html>

如果按照上述复制步骤操作，您会看到两个选项之间的所有内容都已按预期选择（包括在内）。

由于

Answer 1

GXT 3中的ListField类（因为你用3进行了测试，我还没有打开2.x项目......）是为单一选择而设计的 - 类声明标记它在某些T上是通用的，因此可以分配给HasValue<T>并包装呈现ListView项的T。仅从那一点开始，我就预测（并确认）ListView是单一选择的连接：

public ListField(ListView<M, T> view) {
  super(view);
  this.listView = view;
  this.listView.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);

当然，您可以修改此设置，但不会更改泛型，以便getValue() 突然返回List<T>而不是T。

这意味着发生的事情不是选择被破坏，而是您尝试在为单一选择设置的列表中进行多选。

如果您实际上不需要ListField，但想要获取多选数据，请考虑创建ListView。这在GXT 2或3中或多或少都是相同的 - 创建ListView，就像你现在所做的那样，这次将选择模型设置为MULTI或SIMPLE（查看JavaDoc来决定适用）。

要验证这在GXT 2/3中是否有效：

http://www.sencha.com/examples-2/#listtolist有多个列表视图，配置为使用多选，我通过点击中间项目进行验证，滚动到接近结尾，切换单击当前可见的中间项目，验证所有预期的项目现已被选中。
http://www.sencha.com/examples/#ExamplePlace:listtolist是GXT 3中的上述等同物，似乎按照相同的基本步骤工作。

GXT ListField在滚动后不允许shift-select

备注

1 个答案: