2010/07/22

Style a GXT Grid Row Using GridViewConfig

At work, we're using Sencha's Ext GWT library for much of our GWT based application. A few weeks back, I needed to implement some functionality to style rows in the grid based on information in the model data. After struggling through a number of poor approaches, I found GridViewConfig, which sorted things out nicely. While the logic for determining style in our app is more complex, this simple case demonstrates the principle:


Tho I've found the CSS side of things to be more finicky than I would have hoped:

2 comments:

  1. Dan,
    GREAT post. I haven't seen an example of doing this till now (at least not this clear and consise). However (comma) just for a little clarity, what event did you catch and insert the code??
    ~richard

    ReplyDelete
  2. Richard,
    Thanks :) The code is inside the onRender method of the containing ContentPanel. Essentially, the setup is:

    public class FooPanel extends ContentPanel {
      ...
      @Override
      protected void onRender(Element parent, int pos) {
        super.onRender(parent, pos);
        ...
        grid = new Grid(store, new ColumnModel(columnConfig));
        ...
        grid.getView().setViewConfig(new GridViewConfig() {
          ...
        });
        ...
      }
    }

    - Dan

    ReplyDelete