Page 2 of 2 FirstFirst 12
Results 11 to 17 of 17

Thread: [1.2]Need sample code for placing QuickTip in grid cell using GridCellRenderer

  1. #11
    Sencha Premium User
    Join Date
    Nov 2008
    Location
    Vienna - Austria
    Posts
    888

    Default

    For a renderer to run again, you need to do a refresh in the GridView...
    You can do it in the whole grid, or by row (but for that you will need to override the GridView, making the refreshRow method public.

    Hope this helps you.

    Regards,
    Michel.

  2. #12

    Question Need ToolTip for Validation Errors

    Hello,

    I am currently implementing an EditorGrid whose values I validate in the server-side via a RPC call. Once I receive the errors back from the server I need to display them to the user on the level of the properties, I mean, if there is an error in a property of a record, I have to highlight this situation using a red frame around that particular cell/property.

    This implies that I have to dinamicaly change the content of the tool tip, and the styles of the cell. Plus, at the beginning my cells shouldn't have any Tooltip at all.

    What I am currently doing is modifying the inner HTML for the cell to set the error message as the value of a qtip attribute (I am using QuickTip as suggested before in this forum), but this results in empty tooltips:

    Here you are my code:

    protected static String INNER_STYLE = "\" style='background-color=#FFCCCC; border-styleolid; border-width:1px; border-color:red;'/>";

    /**
    * The grid to display the data
    */
    protected EditorGrid<T> m_grid;

    /**
    * The quick tip that sets how the tool tips will be displayed
    */
    protected QuickTip m_quickTip;

    ...

    public String composeInnerCellDivStyle(Element cell, String errorMessage){
    //IMPORTANT: It is necessary to have previously set QuickTip for the grid!
    if(m_quickTip == null){
    GWT.log("No QuickTip set for the grid. Validation error tooltip are not going to work!", null);
    }
    //compose the inner HTML code for the cell
    //add the 'error' style to the <div>
    String innerHTML = cell.getInnerHTML().replaceFirst("\">", INNER_STYLE);
    //wrap the inner div with a <span> tag containing the tool tip
    String html = "<span onmouseover=\"javascript:howToolTip" + "( '" + errorMessage + "' );\">" +
    (innerHTML != null ? innerHTML : "") + "</span>";
    return html;
    }

    Has anybody done something similar? I am looking forward to reading your answers!

    Thanks in advance!

    Carlos

  3. #13

    Default

    Sorry, but in fact my code when setting the Tooltip is this one:

    String html = "<span qtip=" + errorMessage + "'\">" +
    (innerHTML != null ? innerHTML : "") + "</span>";

    Cheers,

    Carlos

  4. #14
    Sencha Premium User
    Join Date
    Nov 2008
    Location
    Vienna - Austria
    Posts
    888

    Default

    Quote Originally Posted by cuetumayu View Post
    Sorry, but in fact my code when setting the Tooltip is this one:

    String html = "<span qtip=" + errorMessage + "'\">" +
    (innerHTML != null ? innerHTML : "") + "</span>";
    This is wrong.

    Try this:

    Code:
    String html = "<span qtip='" + errorMessage + "'\">" + 
                          (innerHTML != null ? innerHTML : "") + "</span>";
    Please notice that the ' was missing after qtip=

    You can try again...
    Also, why aren't you using the a CellRenderer? This would simplify your stuff...

    Regards,
    Michel.

  5. #15
    Sencha Premium User
    Join Date
    Nov 2008
    Location
    Vienna - Austria
    Posts
    888

    Default

    Hi.
    He was able to fix it.

    More info here:
    http://www.extjs.com/forum/showthread.php?p=390814

  6. #16
    Ext GWT Premium Member jorel2's Avatar
    Join Date
    Apr 2010
    Location
    Durham, NC
    Posts
    161

    Default

    Is this still the way to set tooltips for grid cells?
    Code:
    		column.setRenderer(new GridCellRenderer<RelDescModel>(){
    			@Override
    			public Object render(    RelDescModel model, String property, ColumnData config, 
                                                            int rowIndex, int colIndex,
                                                            ListStore<RelDescModel> store, 
                                                            Grid<RelDescModel> grid) {
    				String desc = model.getDesc();
    				String html = "<span qtip='" + desc + "'>" + desc + "</span>";		
    				return html;
    			}
    		});
    ??

    If so, I am wondering why we need to be exposed to GXT implementation details. Couldn't there just be an override-able method like render called 'setToolTip' in the GridCellRenderer?

    Seems awkward to need to know about an underlying implementation detail like the qtip attribute.
    If this 'concern' is misplaced, please, someone inform me and I'll go away. thanks.

  7. #17
    Sencha Premium Member
    Join Date
    Sep 2007
    Posts
    13,976

    Default

    Seems awkward to need to know about an underlying implementation detail like the qtip attribute.
    If this 'concern' is misplaced, please, someone inform me and I'll go away. thanks.
    Its nothing underlaying. This is how QuickTip is working and this is even documented in the javadocs of quicktip

Page 2 of 2 FirstFirst 12

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •