What's New?

[CLOSED] Tooltip on CommandColumn

  1. #1
    Jun 17, 2013, 3:09 PM

    [CLOSED] Tooltip on CommandColumn

    I have the following gridpanel:

    Click image for larger version.  Name: Capturagrid.JPG  Views: 24  Size: 46.3 KB  ID: 6392


    How I can add a tooltip to each of the flags?



    An example of code commandcolumn on the client side is:

    <ext:CommandColumn ID="CommandColumnFeb" runat="server" Width="40" Text="Feb" Hideable="false"  Resizable="false" DataIndex="Feb">
                 <Commands>
                   <ext:GridCommand Icon="FlagGreen"  CommandName="NotifNo"  Hidden ="true" />
                   <ext:GridCommand Icon="FlagRed"  CommandName="NotifYes" Hidden="true" />  
                   <ext:GridCommand Icon="FlagYellow"  CommandName="NotifYesA" Hidden="true" />
               </Commands>
               <PrepareToolbar Fn="prepareToolbarFeb"  />
                </ext:CommandColumn> 

         var prepareToolbarFeb = function (grid, toolbar, rowIndex, record) {
             if (record.get("Feb") == 'Rojo') {
                 toolbar.items.getAt(0).hide();
                 toolbar.items.getAt(1).show();
                 toolbar.items.getAt(2).hide();
             }
             if (record.get("Feb") == 'Verde') {
                 toolbar.items.getAt(0).show();
                 toolbar.items.getAt(1).hide();
                 toolbar.items.getAt(2).hide();
             }
             if (record.get("Feb") == 'Amarillo') {
                 toolbar.items.getAt(0).hide();
                 toolbar.items.getAt(1).hide();
                 toolbar.items.getAt(2).show();
             }
         };

    The tooltip content I wish to add from the codebehind:

    Function CreaLed(Ub As Double, DMes As Integer, DEq As Integer, DEqM As Integer)
    Dim valor As String = ""
    If DMes > DEq Then valor = "Rojo"
    If DMes <= DEq Then valor = "Amarillo"
    If DMes <= DEqM Then valor = "Verde"

'Tooltip CommandColumn: (Dmes/DEq)

    Return valor
    End Function
    how could I do that?

    thanks!!
    Last edited by Daniil; Jun 25, 2013 at 7:48 AM. Reason: [CLOSED]
  2. #2
    Jun 17, 2013, 4:54 PM
    Hi @JCarlosF,

    Is a GridCommand's ToolTip-Text property not what you need?
    <ext:GridCommand ToolTip-Text="Hello" />
  3. #3
    Jun 17, 2013, 5:11 PM
    Quote Originally Posted by Daniil View Post
    Hi @JCarlosF,

    Is a GridCommand's ToolTip-Text property not what you need?
    <ext:GridCommand ToolTip-Text="Hello" />
    exactly that need, but as I can assign value from the codebehind?

    considering that the tooltip should be different in each cell

    thanks!
  4. #4
    Jun 18, 2013, 12:39 AM
    Hello!


    Quote Originally Posted by JCarlosF View Post
    considering that the tooltip should be different in each cell
    What do you mean by different in each cell?

    Quote Originally Posted by JCarlosF View Post
    exactly that need, but as I can assign value from the codebehind?
    Take a look at the following sample:

    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            this.Store1.DataSource = new object[]
            {
                new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" }
            };

            this.Store1.DataBind();
            
            (MyCommandColumn.Commands[0] as GridCommand).ToolTip.Text = "Another Delete Tooltip";
            (MyCommandColumn.Commands[2] as GridCommand).ToolTip.Text = "Another Edit Tooltip";
        }
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
</head>
<body>
    <form runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Store ID="Store1" runat="server">
            <Model>
                <ext:Model runat="server">
                    <Fields>
                        <ext:ModelField Name="company" />
                        <ext:ModelField Name="price" Type="Float" />
                        <ext:ModelField Name="change" Type="Float" />
                        <ext:ModelField Name="pctChange" Type="Float" />
                        <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                    </Fields>
                </ext:Model>
            </Model>
        </ext:Store>
        
        <ext:GridPanel 
            runat="server" 
            StoreID="Store1" 
            Width="800" 
            Height="300">
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
                    
                    <ext:CommandColumn runat="server" Width="100" Text="Toolbar Cmds" ID="MyCommandColumn">
                        <Commands>
                            <ext:GridCommand Icon="Delete" CommandName="Delete">
                                <ToolTip Text="Delete" />
                            </ext:GridCommand>
                            <ext:CommandSeparator />
                            <ext:GridCommand Icon="NoteEdit" CommandName="Edit">
                                <ToolTip Text="Edit" />
                            </ext:GridCommand>
                        </Commands>
                        <Listeners>
                            <Command Handler="Ext.Msg.alert(command, record.data.company);" />
                        </Listeners>
                    </ext:CommandColumn>
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:RowSelectionModel runat="server" Mode="Single" />
            </SelectionModel>            
        </ext:GridPanel>  
    </form>
</body>
</html>
  5. #5
    Jun 18, 2013, 3:36 PM 
                
            (MyCommandColumn.Commands[0] as GridCommand).ToolTip.Text = "Another Delete Tooltip";
            (MyCommandColumn.Commands[2] as GridCommand).ToolTip.Text = "Another Edit Tooltip";


    this works very well, but I need a tooltip for each cell
  6. #6
    Jun 18, 2013, 3:42 PM
    Do you mean different tooltips for different rows? If so, it should be done via a separate "full" ToolTip control and its Delegate option.
    https://examples2.ext.net/#/Miscella..._Cell_Tooltip/
  7. #7
    Jun 18, 2013, 3:44 PM
    What do you mean by different in each cell?

    this means that the tooltip is variable in each cell, this value depends on a database, would need to use something like the preparecommand but by assigning the values ​​from the codebehind,

    TryCast(CommandColumnNov.Commands(0), GridCommand).ToolTip.Text = DMes & " / " & DEq
    DMes and DEq ----> these are variables that are calculated in the codebehind


    You that suggest me for this?




    thanks!
  8. #8
    Jun 18, 2013, 9:34 PM
    Please, try @Daniil's suggestion. You should use "full" tooltip in this case.

Similar Threads

  1. [CLOSED] Tooltip on GridPanel CommandColumn displays "undefined"
    By wisdomchuck in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 10, 2013, 6:39 PM
  2. [CLOSED] CommandColumn how to set Css??
    By gs_user in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 29, 2012, 4:22 AM
  3. [0.8.2] CommandColumn and Renderer
    By SouthDeveloper in forum Bugs
    Replies: 4
    Last Post: Jan 20, 2010, 3:54 PM
  4. Help. regarding commandcolumn
    By ydnah2 in forum 1.x Help
    Replies: 2
    Last Post: Aug 19, 2009, 11:46 AM

Posting Permissions