CODEWITHSUNDEEP
gwtgridtooltipgxt
user1847252
user1847252

Reputation: 11

Ext-GWT 3.0 Grid Mouse Events

I have a grid which gets populated from the database and works fine. Now I want to add a mouseover event to this grid and display a tooltip text which shows all the column values in multi-line fashion for the highlighted record. The business case here is that there are quite a few columns that are being displayed in the grid and the user would like to have a quick preview instead of horizontally scrolling all the way to the end, before selecting the record. Squeezing all these columns to fit into the screen is not a clean solution in this case.

I have tried looking through all the available methods in the GXT 3.0 API for Grid and GridView but couldn't find anything to get the highlighted records. There are a couple of events for MouseMove, MouseDown and MouseClick but none for MouseOver.

I tried various forums as well to find a solution but there doesn't seem to be one yet so thought it might be useful for others as well if I start this thread.

Please note that this issue is not related to Ext-JS. The version I am using is Ext-GWT 3.0.1.

Thanks

Upvotes: 1

Views: 1202

Answers (2)

SwiftMango
SwiftMango

Reputation: 15284

MouseMove IS the one you want. It's only fired when the mouse is over the widget.

Alternatively, you can sink a DOM event to the widget by using:

DOM.sinkEvents(widget.getElement(), Event.ONMOUSEOVER);

in your widget's constructor or onLoad method, and then override the widget's onBrowserEvent:

@Override
public void onBrowserEvent(Event event){
final int eventType = DOM.eventGetType(event);
    if(eventType == Event.ONMOUSEOVER) {
        //DISPLAY THE INFO
    }
}

This is definitely harder than directly adding a handler but pretty customizable. You can choose either one.

BTW you might want to get the position of mouse by using:

mouseX = DOM.eventGetClientX(event);
mouseY = DOM.eventGetClientY(event);

Upvotes: 2

Jonathan
Jonathan

Reputation: 705

You could accomplish this by creating a custom Cell, and passing that to the grid's specific ColumnConfig.

With the custom Cell, you have access to all the events you would need. Once you have access to the info you need, displaying it can be done in many ways. GXT provides a lot of solutions for this. Quicktips may be the way to go here though.

Upvotes: 1

Related Questions