Monthly Archives: December 2011

Events

There are a lot of events within GXT. I have created a class-overview.

Sometimes I ask myself, which event I will get from a widget and which listener I have to use.

Follow these steps:

  1. Go to the documentation of the class, which is the event source (i.e. Grid)
  2. Look for the right event (like CellClick)
  3. You will see, that CellClick generates a GridEvent. GridEvents can have a generic type, which is related to the ModelData displayed within the grid.

  4. Go to enumeration Events. Choose the right EventType (Events.CellClick)
  5. There are also events like On***. These events are DOM events (browser events). You can also listen to OnClick, but you won’t get high level information like ModelData.

  6. Implement a listener class, which implements the interface Listener
  7. Because the CellClick event type generates a GridEvent, our listener should implement Listener<GridEvent>. There are some special listener like DNDListener which provide additional empty methods for some event types related to special field (like drag&drop). But it is always possible to implement the Listener interface and split the events on their types without any helper classes.

TreeStore<ModelData> store = new TreeStore<ModelData>();
// listen to all events
store.addStoreListener(new SpecialStoreListener());
// or 
store.add(Events.Store.Add, new BaseStoreListener());
store.add(Events.Store.BeforeClear, new BaseStoreListener());
store.add(Events.Store.Sort, new BaseStoreListener());
public class SpecialStoreListener extends StoreListener<ModelData> {
   // override the provided methods as needed
}
public class BaseStoreListener implements Listener<StoreEvent<ModelData>> {
   public void handleEvent(StoreEvent<ModelData> evt) {
      if (e.getType() == Store.Add) {

      } else if (e.getType() == Store.BeforeClear) {

      } else if (e.getType() == Store.Sort) {

      }
   }
}

As you can see, you will have always methods to register a special listener (i.e. store.addStoreListener() instead of store.addListener()). But it is not documented, which class can use such a listener. You have to look into the outline of each class. I have created a listener overview, so you can check the supported EventTypes for each listener.

Filter selection within a TreeGrid

Every node within a TreeGrid can be selected. But sometimes you only need the leafs or only a few of them. It is possible to filter the selection later, just before you execute an action on the selected nodes. But the better way is to prevent a selection on obsolete nodes. Use a custom SelectionModel for that.

public class CustomSelectionModel extends GridSelectionModel<ModelData> {

	public CustomSelectionModel() {
		addListener(Events.BeforeSelect, new NoSelectionListener());
	}

	private class NoSelectionListener
		implements Listener<SelectionEvent<ModelData>> {

		@Override
		public void handleEvent(SelectionEvent<ModelData> se) {
			ModelData model = se.getModel();
			if (model instanceof Something) {
				se.setCancelled(true);
			}
		}

	}
}

You can also use properties of the model to make a decision, but sometimes you can simply ask for the instance type (i.e. folders and files).

Bold font on TreeGrid

You can have a bold font on a TreeGrid. Create your own renderer and enhance the HTML returning by the renderer.

private class BoldGridCellRenderer extends TreeGridCellRenderer<ModelData> {
	protected String getText(TreeGrid<ModelData> grid, ModelData model, String property, int rowIndex, int colIndex) {
		return "<span style=\"font-weight:bold\">" + super.getText(grid, model, property, rowIndex, colIndex) + "</span>";
	}
}

Add the renderer to your tree column (use always TreeGridCellRenderer for that column!).

ColumnConfig name = new ColumnConfig("name", "Name", 300);
name.setRenderer(new BoldGridCellRenderer());