Apr 27, 2015, 5:36 PM
[CLOSED] Complex HTML ToolTip on Single object in GridPanel cell
Hi,
in this example a ToolTip is showed in all cells.
It's possible show the ToolTip ONLY on "mouse over" on ImageInfo object?
I need show the row's details in a complex HTML ToolTip, but ONLY when I move the mouse on the ImageInfo Object.
Can you help me?
The Code:
in this example a ToolTip is showed in all cells.
It's possible show the ToolTip ONLY on "mouse over" on ImageInfo object?
I need show the row's details in a complex HTML ToolTip, but ONLY when I move the mouse on the ImageInfo Object.
Can you help me?
The Code:
<%@ Page Language="vb" AutoEventWireup="true" Inherits="B2B.WEB.WebForm1" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
Protected Sub Page_Load(sender As Object, e As EventArgs)
If Not (Ext.Net.X.IsAjaxRequest) Then
Store1.DataSource = New Object() {New Object() {"aaa", 1}, New Object() {"bbb", 2}, New Object() {"ccc", 3}}
Store1.DataBind()
End If
End Sub
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>GridPanel Row with ToolTip - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<script>
var onShow = function (toolTip, grid) {
var view = grid.getView(),
record = view.getRecord(toolTip.triggerElement),
data = Ext.encode(record.data);
toolTip.update(data);
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server" Title="Array Grid" Width="600" Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Col1" Type="String" />
<ext:ModelField Name="Col2" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:ComponentColumn runat="server" Text="X" Width="30" >
<Component>
<ext:Image runat="server" ID="ImageInfo" ImageUrl="~/Immagini/Info.png" />
</Component>
</ext:ComponentColumn>
<ext:Column runat="server" Text="Col 1" DataIndex="Col2" />
<ext:Column runat="server" Text="Col 2" DataIndex="Col2" />
</Columns>
</ColumnModel>
</ext:GridPanel>
<ext:ToolTip
runat="server"
Target="={#{GridPanel1}.getView().el}"
Delegate="={#{GridPanel1}.getView().itemSelector}"
TrackMouse="true">
<Listeners>
<Show Handler="onShow(this, #{GridPanel1});" />
</Listeners>
</ext:ToolTip>
</form>
</body>
</html>
Last edited by Daniil; May 04, 2015 at 8:09 AM.
Reason: [CLOSED]