How can Set tooltip on single cell on grid?

  1. #1

    How can Set tooltip on single cell on grid?

    Hi,

    After migration from Ext.Net 1.7 to 2.5 the below existing tool-tip is not working as expected.

    	<ext:GridPanel ID="GridPanel1" runat="server" StoreID="storeFiles"
                                    Height="380" AutoScroll="true" EnableColumnMove="false">
                                    <ColumnModel>
                                        <Columns>
                                            <ext:RowNumbererColumn runat="server" />
                                            <ext:Column runat="server" DataIndex="ArtifactType" Text="Artifact" Width="150">
                                            </ext:Column>                                       
                                            <ext:Column runat="server" DataIndex="TextToDisplay" ID="TextToDisplay" Text="Artifact Link"
                                                Width="270">
                                                <Renderer Fn="showAsLinkDocUpload" />
                                                <%--<ToolTips>
                                                </ToolTips>--%>
                                            </ext:Column>
                                            <ext:Column runat="server" DataIndex="Comments" Text="Comments" Width="300" >
                                            </ext:Column>                                       
                                    </ColumnModel>
                                     <SelectionModel>
                                        <ext:RowSelectionModel runat="server" />
                                    </SelectionModel>
                                    <View>
                                        <ext:GridView runat="server" EmptyText="No Records Found" />
                                    </View>
                                    <ToolTips>
                                        <ext:ToolTip ID="ttArtifactsDetails" runat="server"                                 
                                            Target="={#{GridPanel1}.getView().el}"
                                            Delegate=".x-grid-cell" TrackMouse="true" 
                                            BodyCssClass="wrap-tooltip" >
                                            <Listeners>
                                                <Show Handler="showTipForDocUpload(this, #{grdUploadedFiles});" />                                   
                                            </Listeners>
                                        </ext:ToolTip>
                                    </ToolTips>
                                   
                                </ext:GridPanel>
    With above mentioned target the tool-tip is visible for entire row instead of particular column .

    Also referred the below mentioned example but still not able to find out the root cause.

    https://examples2.ext.net/#/Miscella..._Cell_Tooltip/

    Please suggest !

    Thanks in Advance.
  2. #2
    Hi @Sangeeta,

    With above mentioned target the tool-tip is visible for entire row instead of particular column .
    I don't see anything in your code that should make the ToolTip for the particular column only.

    This setting
    Delegate=".x-grid-cell"
    means that a ToolTip is going to be triggered to any cell, because any cell has the "x-grid-cell" CSS class.
  3. #3
    @Daniil

    I have already set delegate in below mentioned code.

      <ext:ToolTip ID="ttArtifactsDetails" runat="server"                                
                                        Target="={#{GridPanel1}.getView().el}"
                                        Delegate=".x-grid-cell" TrackMouse="true"
                                        BodyCssClass="wrap-tooltip" >
                                        <Listeners>
                                            <Show Handler="showTipForDocUpload(this, #{grdUploadedFiles});" />                                  
                                        </Listeners>
                                    </ext:ToolTip>
    Can we set tool-tip based on column id?
    Please suggests!
  4. #4
    Can we set tool-tip based on column id?
    There is no such a setting.

    How have you achieved it for v1? I thing the same approach should work for v2.
  5. #5
    @Daniil,

    In V1 it was working fine with below mentioned code

     <ToolTips>
                                        <ext:ToolTip ID="ttArtifactsDetails" runat="server"
                                           Target="={#{grdUploadedFiles}.getView().mainBody}"
                                            Delegate=".x-grid3-cell"  
                                            BodyCssClass="wrap-tooltip">
                                            <Listeners>
                                                <Show Handler="showTipForDocUpload(this, #{grdFiles}, #{storeFiles})" />
                                            </Listeners>
                                        </ext:ToolTip>
                                    </ToolTips>
    In V2 , changed the target and delegate but its displaying tool-tip for each cell.
  6. #6
    This ToolTip should be triggered for each cell in v1 as well.

    Please demonstrate the code of the showTipForDocUpload function.
  7. #7
    @Daniil

    Below is the code for tool-tip
    var showTipForDocUpload = function (toolTip, grid) {   
        
        var view = grid.getView(),
            //store = grid.getStore(),
            record = view.getRecord(view.findItemByChild(toolTip.triggerElement)),
           // column = view.getHeaderByCell(toolTip.triggerElement),
            data = record.data.FileURL;//record.get(column.dataIndex);
    
        toolTip.update(data);
    };
    tool-tip is displaying right data.
  8. #8
    Ok, thanks. I sill think that it should be triggered for any cell. Please provide a full working example for v1.

Similar Threads

  1. Multiple information in single cell in GridPanel
    By jamalmellal in forum 2.x Help
    Replies: 1
    Last Post: Oct 29, 2013, 5:46 PM
  2. [CLOSED] Grid cell tooltip
    By marco.morreale in forum 2.x Legacy Premium Help
    Replies: 9
    Last Post: Dec 21, 2012, 2:18 PM
  3. [CLOSED] Grid-cell Tooltip
    By adelaney in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Oct 10, 2012, 5:43 PM
  4. Replies: 2
    Last Post: Sep 20, 2011, 4:25 AM
  5. Tooltip display on Grid Cell
    By madhugumma in forum 1.x Help
    Replies: 1
    Last Post: Jul 29, 2009, 3:31 PM

Tags for this Thread

Posting Permissions