Grid- Conditional styles on click

[Abarton]

Hello all,

I have a grid that when a row is selected needs to change to one of three styles depending on a conditional in the java code.

I have tried setting styles and attributes in the click handler (does nothing), and I have tried changing the GridViewConfig's getRowStyle (goes to default selected color, then goes to conditional color a second later).

How should I be going about doing this?

[icfantv]

trying to understand your last statement here. when you say you've changed GridViewConfig's getRowStyle do you mean you have it working as you want, but it's taking a second to take effect?

just glancing at the api, it looks like that is the right class to do what you want. i'm familiar with how I would want to do this at a cell level but not row.

[Abarton]

Correct,
The user clicks on the row, it changes to the default selected color, then a second later it refreshes and changes to the conditional color.

How would I do this at the cell level?

[icfantv]

When you say a second later, are you moving the mouse? I.e., if you click on the row and leave the mouse cursor there (try taking your hand off the mouse) does it still revert back?

If you're moving the mouse, what's probably happening is that the onMouseOut or focus/blur events are being fired which is causing the color change.

Depending on the type of cell you're rendering, you want to override the onBrowserEvent(...) method and listen for the appropriate event and apply the style you want. Here's an example we've done for mouse events:

   @Override
   public void onBrowserEvent(Context context, Element parent, AssetBean value, NativeEvent event, ValueUpdater<AssetBean> valueUpdater) {

      String eventType = event.getType();
      XElement p = parent.cast();
      if ("mouseover".equals(eventType)) {
         onMouseOver(p);
      }
      else if ("mouseout".equals(eventType)) {
         onMouseOut(p);
      }
   }

   protected static void onMouseOut(XElement p) {
      p.addClassName("cursor-default");
      p.removeClassName("cursor-pointer");
   }

   protected static void onMouseOver(XElement p) {
      p.removeClassName("cursor-default");
      p.addClassName("cursor-pointer");
   }

If you do wind up constructing your own cell, make sure you pass to super(...) the events to which you want to subscribe or you won't get them:

import com.google.gwt.cell.client.AbstractCell;

public class MyCell extends AbstractCell<MyBean>
{
   public MyCell()
   {
      super("click", "keydown", "mouseover", "mouseout");
   }


*** snip ***

I would caution against using this approach for the entire row however. If you're looking for a more thorough answer that applies to the row, the GXT devs hang out in #extgwt on Freenode IRC.