ColdFusion or IE?

I have been working on displaying the grid for the calendar widget. I use JSON to parse the data from the ColdFusion for the GXT grid store. The data from the database is formatted a lot in ColdFusion, using a couple of loops. The problem is that ColdFusion unwraps the loop and place as white spaces in HTML and send them back to the user. Well another problem here is that the white spaces returned by ColdFusion is handled by chrome and safari very good except for IE.

In my case when using couple of loops with around 36 records ( well lots of formatting done for each record)  it returns a HTML file with around 4500 lines of white space, and just about 100 lines of useful data.  My application with the white spaces would take something like 4-5 sec to load in safari but would take about a whooping 1.5 min when trying to display in IE.

Well now should ColdFusion return the HTML with the white spaces or should IE have better white space handling??

Adding a listener to a HTML element in gxt

I was trying to add a listener to a HTML element and finally figured out how to do that.

The current scenario is that of a grid, which has a HTML image in one column and a listener has to be attached, so that it performs a task when clicked.

I placed the HTML tag in the grid cell renderer for that particular column

  1: employeeColumn.setRenderer(new GridCellRenderer<ModelData>(){
  2:  public String render(ModelData model, String property,
  3:   ColumnData config, int rowIndex, int colIndex,
  4:   ListStore<ModelData> store) {
  5:    return model.get("fullname")+"<span qtip='copy'><image class=\"copy\" src = 'image/arrow_right.png'></image></span>";
  6:  }
  7: });

The image used has a class name which is used to identify that image in the listener. 

Writing the listener

  1: grid.addListener(Events.CellClick, new Listener<BaseEvent>(){
  2:        public void handleEvent(BaseEvent be) {
  3:          GridEvent ge = (GridEvent)be;
  4:           if(ge.colIndex == 0)
  5:   {
  6:           if(ge.getTarget(".copy", 1) != null)
  7:    {
  8:                         }
  9:                 }
 10:        }
 11: });

My employeeColumn is my first column in the grid, so i select this column in the cell click event. And then I try to select the image with the class copy by checking with the highlighted condition if the target is “copy”.

Setting tool tip for data in grid cells GXT

I have been working a lot on grid lately and had to get a tool tip with some information when we go over the grid cell that has data. I looked around and found QuickTip class in GXT that can be used. The data in the tooltip has to be written in HTML.

How to use it?

Create and initialize quickTip for the grid or for any widget you want the tool tip for

QuickTip quickTip = new QuickTip(grid);

using quickTip when rendering a grid column

1:    cm.getColumn(i).setRenderer(new GridCellRenderer<ModelData>(){  
2:          public String render(ModelData model,  
3:                     String property, ColumnData config,  
4:       int rowIndex, int colIndex,  
5:       ListStore<ModelData> store) {  
6:      String myColumnData = model.get( "satCellValue" );  
7:      StringBuffer  tooltip = new StringBuffer();  
8:      tooltip.append(model.get("satsiteno")).append(" - ").append(model.get("satdeptno"))  
9:     .append("<br>").append(model.get("satstartTime")).append(" - ").append(model.get("satendTime")); 
10:              String html = "<span qtip='" + tooltip + "'>" 
11:     + myColumnData + "</span>"; 
12:     return html; 
13:    } 
14:    return ""; 
15:    } 
16:   });

In the render method of gridCellRenderer add the quickTip html to the data for that column using qtip which indicates the quickTip data. I have not tried it but i think quickTip works the same for all the other widgets as well.