PDA

View Full Version : [CLOSED] GridPanel - CommandColumn - dynamic Tooltip



jamesand
Aug 22, 2013, 12:38 PM

blueworld
Aug 22, 2013, 12:53 PM
<ext:CommandColumn ID="Test" runat="server" Width="25">
<Commands>
<ext:GridCommand >
<ToolTip Text="" />
</ext:GridCommand>
</Commands>
<PrepareCommand Fn="checkTooltip" />
</ext:CommandColumn>





var checkTooltip= function (grid, command, record, row) {

command.qtext = record.data.NOMBRE_EVENTO;

};

jamesand
Aug 22, 2013, 1:08 PM
Thank you Blueworld for your response, but I'm afraid it doesn't work for me. If I write:


<ext:CommandColumn ID="CommandColumn1" runat="server">
<Commands>
<ext:GridCommand Icon="SportSoccer" CommandName="AsignacionAbonos">
<ToolTip Text="Asignar Abonos" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand Icon="NoteEdit" CommandName="GestionarNotas">
<ToolTip Text="Gestionar notas" />
</ext:GridCommand>
<PrepareCommand Fn="checkTooltip" />
</Commands>

It crashes compliling saying: "preparecommand is not admited"

blueworld
Aug 22, 2013, 1:12 PM
Thank you Blueworld for your response, but I'm afraid it doesn't work for me. If I write:


<ext:CommandColumn ID="CommandColumn1" runat="server">
<Commands>
<ext:GridCommand Icon="SportSoccer" CommandName="AsignacionAbonos">
<ToolTip Text="Asignar Abonos" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand Icon="NoteEdit" CommandName="GestionarNotas">
<ToolTip Text="Gestionar notas" />
</ext:GridCommand>
<PrepareCommand Fn="checkTooltip" />
</Commands>

It crashes compliling saying: "preparecommand is not admited"

Try after Commands tag



<ext:CommandColumn ID="CommandColumn1" runat="server">
<Commands>
<ext:GridCommand Icon="SportSoccer" CommandName="AsignacionAbonos">
<ToolTip Text="Asignar Abonos" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand Icon="NoteEdit" CommandName="GestionarNotas">
<ToolTip Text="Gestionar notas" />
</ext:GridCommand>
</Commands>
<PrepareCommand Fn="checkTooltip" />


And since you have two commands, you will need to check for the right command



var checkTooltip= function (grid, command, record, row) {
if(command.command == "....."){
command.qtext = record.data.NOMBRE_EVENTO;
}
};

jamesand
Aug 22, 2013, 1:33 PM
I already tried it: "preparecommand is not admited"

It looks like it comes from 1.X version. 2.X may have changed this??

blueworld
Aug 22, 2013, 1:44 PM
Try

ImageCommandColumn instead of CommandColumn
and
ImageCommand instead of GridCommand

Daniil
Aug 22, 2013, 5:33 PM
Hi everybody,

Actually, here is an example of setting ToolTips dynamically for a CommandColumn's GridCommands.
http://examples2.ext.net/#/GridPanel/Commands/Prepare_Toolbar/

Here is a bit simplified example.

Example

<%@ 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)
{
Store store = this.GridPanel1.GetStore();
store.DataSource = new object[]
{
new object[] { "test1", "test2", "test3" },
new object[] { "test4", "test5", "test6" },
new object[] { "test7", "test8", "test9" }
};
}
}
</script>

<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>

<script>
var prepare = function (grid, toolbar, rowIndex, record) {
var firstButton = toolbar.items.get(0);

firstButton.setTooltip(record.data.test3);
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="test1" />
<ext:ModelField Name="test2" />
<ext:ModelField Name="test3" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="Test1" DataIndex="test1" />
<ext:Column runat="server" Text="Test2" DataIndex="test2" />
<ext:Column runat="server" Text="Test3" DataIndex="test3" />
<ext:CommandColumn runat="server">
<Commands>
<ext:GridCommand Text="Command" CommandName="Command" Icon="Accept" />
</Commands>
<PrepareToolbar Fn="prepare" />
</ext:CommandColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

@blueworld, thank you for your attention to this thread. By the way, you are right that it might be better to use ImageCommands and ImageCommandColumns instead since it is better in the performance aspect.