使用内联编辑模式时，GXT3网格无法为复选框发送事件

Question

我使用带有InlineEdit模式的GXT 3网格，大致遵循(或多或少)他们站点上的示例代码。我不认为有一种方法可以让复选框单元格触发'EditComplete‘事件，如果是的话，我不确定在接收到它之后，如何禁用同一行的日期单元格。只需查找下面代码中的注释："//不触发复选框：“。

下面的代码适用于Eclipse应用程序项目--您只需要在'onModuleLoad‘方法中使用它，如下所示：

public void onModuleLoad() {
  GridInlineEditingTest j = new GridInlineEditingTest();
}

下面是代码：

    import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import com.google.gwt.cell.client.DateCell;
import com.google.gwt.core.client.GWT;
import com.google.gwt.editor.client.Editor.Path;
import com.google.gwt.i18n.client.DateTimeFormat;
import com.google.gwt.i18n.client.DateTimeFormat.PredefinedFormat;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sencha.gxt.cell.core.client.form.CheckBoxCell;
import com.sencha.gxt.core.client.ValueProvider;
import com.sencha.gxt.data.shared.ListStore;
import com.sencha.gxt.data.shared.ModelKeyProvider;
import com.sencha.gxt.data.shared.PropertyAccess;
import com.sencha.gxt.data.shared.Store;
import com.sencha.gxt.widget.core.client.FramedPanel;
import com.sencha.gxt.widget.core.client.button.TextButton;
import com.sencha.gxt.widget.core.client.container.BoxLayoutContainer.BoxLayoutPack;
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer;
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer.VerticalLayoutData;
import com.sencha.gxt.widget.core.client.container.Viewport;
import com.sencha.gxt.widget.core.client.event.CompleteEditEvent;
import com.sencha.gxt.widget.core.client.event.CompleteEditEvent.CompleteEditHandler;
import com.sencha.gxt.widget.core.client.event.SelectEvent;
import com.sencha.gxt.widget.core.client.event.SelectEvent.SelectHandler;
import com.sencha.gxt.widget.core.client.form.CheckBox;
import com.sencha.gxt.widget.core.client.form.DateField;
import com.sencha.gxt.widget.core.client.form.DateTimePropertyEditor;
import com.sencha.gxt.widget.core.client.grid.ColumnConfig;
import com.sencha.gxt.widget.core.client.grid.ColumnModel;
import com.sencha.gxt.widget.core.client.grid.Grid;
import com.sencha.gxt.widget.core.client.grid.Grid.GridCell;
import com.sencha.gxt.widget.core.client.grid.GridView;
import com.sencha.gxt.widget.core.client.grid.editing.GridEditing;
import com.sencha.gxt.widget.core.client.grid.editing.GridInlineEditing;

public class GridInlineEditingTest {
  public GridInlineEditingTest() {
        VerticalLayoutContainer vlc = new VerticalLayoutContainer();
        vlc.add(createGrid(), new VerticalLayoutData(1, 1));

        Viewport vp = new Viewport();
        vp.add(vlc);
        RootPanel.get().add(vp);
      }

      interface PlaceProperties extends PropertyAccess<Plant> {
        ValueProvider<Plant, Date> available();

        @Path("id")
        ModelKeyProvider<Plant> key();
        ValueProvider<Plant, String> name();
        ValueProvider<Plant, Boolean> indoor();
      }

      private static final PlaceProperties properties = GWT.create(PlaceProperties.class);

      protected Grid<Plant> grid;
      private FramedPanel panel;
      private ListStore<Plant> store;
      private DateField dateField;

      public Widget createGrid() {
        if (panel == null) {
          ColumnConfig<Plant, String>   nameCol     = new ColumnConfig<Plant, String>(  properties.name(),      220,    "Name"  );
          ColumnConfig<Plant, Date>     dateCol     = new ColumnConfig<Plant, Date>(    properties.available(), 95,     "Date"  );
          ColumnConfig<Plant, Boolean>  indorCol    = new ColumnConfig<Plant, Boolean>( properties.indoor(),    55,     "Indoor");

          // display formatting
          DateCell dateCell = new DateCell(DateTimeFormat.getFormat(PredefinedFormat.DATE_SHORT));
          dateCol.setCell(dateCell);

          // display a checkbox in the gridview
          indorCol.setCell(new CheckBoxCell());


          List<ColumnConfig<Plant, ?>> l = new ArrayList<ColumnConfig<Plant, ?>>();
          l.add(nameCol);
          l.add(dateCol);
          l.add(indorCol);
          ColumnModel<Plant> columns = new ColumnModel<Plant>(l);

          store = new ListStore<Plant>(properties.key());
          store.setAutoCommit(false);
          store.addAll(getPlants());

          GridView<Plant> gridView = new GridView<Plant>();
          grid = new Grid<Plant>(store, columns, gridView);
          grid.getView().setAutoExpandColumn(nameCol);

          // EDITING//
          final GridEditing<Plant> editing = new GridInlineEditing<Plant>(grid); 
          dateField = new DateField(new DateTimePropertyEditor(DateTimeFormat.getFormat(PredefinedFormat.DATE_SHORT)));
          dateField.setClearValueOnParseError(false);
          editing.addEditor(dateCol, dateField);
          CheckBox checkField = new CheckBox();
          editing.addEditor(indorCol, checkField);

          editing.addCompleteEditHandler( new CompleteEditHandler<Plant>(){

              // not firing for checkbox:
              @Override
              public void onCompleteEdit(CompleteEditEvent<Plant> event) {
                  GridCell cell = event.getEditCell();

                  int row = cell.getRow();
                  int col = cell.getCol();
                  System.out.println("got here. row "+row+", col "+col);

              }
          });

          panel = new FramedPanel();
          panel.setHeadingText("Editable Grid Example");
          panel.setPixelSize(600, 400);
          panel.addStyleName("margin-10");

          VerticalLayoutContainer con = new VerticalLayoutContainer();
          con.setBorders(true);
          con.add(grid, new VerticalLayoutData(1, 1));

          panel.setWidget(con);
          panel.setButtonAlign(BoxLayoutPack.CENTER);
          panel.addButton(new TextButton("Reset", new SelectHandler() {
            @Override
            public void onSelect(SelectEvent event) {
              store.rejectChanges();
            }
          }));

          panel.addButton(new TextButton("Save", new SelectHandler() {
            @Override
            public void onSelect(SelectEvent event) {
              store.commitChanges();
            }
          }));
        }
        return panel;
      }

      private static int AUTO_ID = 0;

      public class Plant {
        private DateTimeFormat df = DateTimeFormat.getFormat("MM/dd/y");
        private int id;
        private String name;
        private String light;
        private double price;
        private Date available;
        private boolean indoor;
        private String color;
        private int difficulty;
        private double progress;

        public Plant() {
          id = AUTO_ID++;
          difficulty = (int) (Math.random() * 100);
          progress = Math.random();
        }

        public Plant(String name, String light, double price, String available, boolean indoor) {
          this();
          setName(name);
          setLight(light);
          setPrice(price);
          setAvailable(df.parse(available));
          setIndoor(indoor);
        }

        public int getId() {                            return id;                      }
        public double getProgress() {                   return progress;                }
        public String getColor() {                      return color;                   }
        public int getDifficulty() {                    return difficulty;              }
        public Date getAvailable() {                    return available;               }
        public String getLight() {                      return light;                   }
        public String getName() {                       return name;                    }
        public double getPrice() {                      return price;                   }
        public boolean isIndoor() {                     return indoor;                  }

        public void setId(int id) {                     this.id = id;                   }
        public void setProgress(double progress) {      this.progress = progress;       }
        public void setAvailable(Date available) {      this.available = available;     }
        public void setDifficulty(int difficulty) {     this.difficulty = difficulty;   }
        public void setColor(String color) {            this.color = color;             }
        public void setIndoor(boolean indoor) {         this.indoor = indoor;           }
        public void setLight(String light) {            this.light = light;             }
        public void setName(String name) {              this.name = name;               }
        public void setPrice(double price) {            this.price = price;             }

        @Override
        public String toString() {
          return name != null ? name : super.toString();
        }
      }

      public List<Plant> getPlants() {
        List<Plant> plants = new ArrayList<Plant>();
        plants.add(new Plant("Bloodroot", "Mostly Shady", 2.44, "03/15/2006", true));
        plants.add(new Plant("Columbine", "Shade", 9.37, "03/15/2006", true));
        plants.add(new Plant("Marsh Marigold", "Mostly Sunny", 6.81, "05/17/2006", false));
        plants.add(new Plant("Cowslip", "Mostly Shady", 9.90, "03/06/2006", true));
        plants.add(new Plant("Dutchman's-Breeches", "Mostly Shady", 6.44, "01/20/2006", true));
        plants.add(new Plant("Ginger, Wild", "Mostly Shady", 9.03, "04/18/2006", true));
        return plants;
      }

}

谢谢。祝你今天愉快！！

Answer 1

在列中设置复选框单元格，然后将字段附加为列的内联编辑器。因此，如果用户单击复选框(单元格)，您期望忽略该单击，而是在其上显示一个复选框(字段)，然后单击哪个用户？

相反，所发生的事情是复选框(单元格)报告它正在使用单击事件来做一些有用的事情--它正在改变它的值。因此，网格编辑机制忽略了单击，因此复选框(字段)永远不会进入编辑模式，因此它当然不会完成编辑模式。

通过将两个不同的复选框绘制在同一个位置，并使其功能不同，您想要达到什么目的？如果您试图使用CheckBoxCell实例来始终绘制网格单元格中的复选框符号，则有两个主要选择：

• 跳过内联编辑中的CheckBox字段，让单元格来处理它。它不会触发编辑事件，但它仍然会直接与商店交互。如果需要，可以侦听单元格的事件，也可以只侦听存储区中的记录更改事件，也可以对单元格进行子类以修改行为。
• 移除CheckBoxCell的事件处理内核，以防止它处理事件--这可能就像重写onBrowserEvent而不做任何操作一样简单，不过我怀疑您实际上希望完全防止它的检查更改行为，这样内联编辑版本就可以处理它了。

最后，请记住，内联编辑的目的是防止网格成为大量字段，并使其只在用户实际与其交互时绘制这些字段。这意味着用户必须首先单击某个字段才能获得类似复选框的内容才能显示出来，然后与该字段进行接口以更改该字段。再看一次CheckBox字段在http://www.sencha.com/examples/#ExamplePlace:inlineeditablegrid的内联可编辑网格(尽管这次是使用自定义单元格)，您将看到这意味着要更改一个值并获得您想要的CompleteEditing事件(以及其他各种字段更改事件)--这真的是您想要的吗？

Answer 2

根据CheckBoxCell#isEditing()的源代码，它说：

复选框永远不会处于“编辑模式”。在检查和未检查之间没有中间状态。

在这里找到替代解决方案，如何在网格GXT上获取选中复选框的行索引。

请看一下网格中的GXT复选框