GWT-Ext: How to show tooltips for the ColumnTree (tree-grid, tree-column) widget

One day, a friend of ours has asked this:

"Hi, how to set the tooltip on the columns of a ColumnTree ? The structure is as follows:

ColumnTree.Column cols[] = new ColumnTree.Column[9]; 
cols[0] = columnTree.new Column("header", 290, "dataIndex");
cols[1] = columnTree.new Column("",50,"dataIndex");
cols[2] = columnTree.new Column("",100,"dataIndex");
cols[3] = columnTree.new Column("",170 , "dataIndex");
cols[4] = columnTree.new Column("",170,"dataIndex");
cols[5] = columnTree.new Column("", 70, "dataIndex"); 
cols[6] = columnTree.new Column("", 120, "dataIndex"); 
cols[7] = columnTree.new Column("", 70, "dataIndex"); 
cols[8] = columnTree.new Column("", 70, "dataIndex"); 

Columns are valued with the TreeLoader ."

The answer cannot be that simple, due to the defunct library GWT-Ext, which isn't under dev for long time. Anyhow, because I used this library first time, and I really like it, I found a way to solve this problem.

The column tree is the implementation of the very known tree-column, or tree-grid widget. This can be editable as well.

So the solution contains 2 files:
- 1. an updated ColumnNodeUI.js that sets the title DOM attribute for each cell with the value of the cell.
- 2. a Java class, called SccColumnTreeEditor.java that updates the title attribute of the cell element, after the completion of the edit action.

 You can download these files from here:
- ColumnNodeUI.js
- SccColumnTreeEditor.java
- GWTExt_TreeColumn.java -- a test class, where you can see how everything is used.


Cheers!


Here's the solution found by our friend Faber:

Hi SCC, I wanted to post my solution on a tooltip using the TreeLoader. I did not want to change the javascript so I did the following:

- a function:

private String getToolTip (Integer value, String tooltip) {
   StringBuilder text = new StringBuilder ();
   text.append ("<div ext:qtitle = \"\" " + "ext:qtip = \"");
   text.append (tooltip);
   text.append ("\"/> "+ value + "</div>");
   return text.toString();
}

and then inside the JSONObject build my tooltip with data that I want.

StringBuilder tooltip = new StringBuilder ();
MyJSon JSONObject = new JSONObject (); / / JsonObject data
tooltip.append ("Label");
tooltip.append (myBean.getValue ()+"  ");
myJSon.put ("value", getToolTip (myBean.getValue (), tooltip.toString ()));
 

This obviously is server-side.

Thanks Faber!