We have a sample that shows how to integrate WebCallOut into WebGrid. You can check the live sample at http://live.intersoftpt.com/cs/WebDesktop/WebCallOut/WebCallOutAndWebGrid.aspx. The sample also available in (assumed that you have installed Intersoft WebUI Studio) WebDesktopSamples project. Please point your mouse to start > All Programs > Intersoft WebUI Studio 2010 R2 > WebUI Studio for ASP.NET > WebDesktop 3 > C# Samples (Visual Studio 2010 Solution). The sample file is WebCallOutAndWebGrid.aspx. It is located inside the WebCallOut folder.

The step-by-step below shows how to integrate WebCallOut into WebGrid.

1. Drag WebGrid and WebCallOut controls to the WebForm.

2. Create a cell template by setting ColumnType to Template.

3. Place an ASP.NET Label control and add OnMouseOver like following.

<ISWebGrid:WebGridColumn ColumnType="Template" Name="Email" Caption="FirstName" Width="100px">
    <CellTemplate>
        <asp:Label ID="Label1" runat="server" Text="Label" ToolTip="" OnMouseOver="return ShowWebCallOut(this)"></asp:Label>
    </CellTemplate>
</ISWebGrid:WebGridColumn>

4. Now, put the following code in InitializeRow server-side event in order to initialize data when WebGrid first loads.

protected void WebGrid1_InitializeRow(object sender, ISNet.WebUI.WebGrid.RowEventArgs e)
{
    WebGridRow row = (WebGridRow)e.Row;
    WebGridCellTemplateContainer cell = row.Cells.GetNamedItem("Email").GetTemplateContainer();
    Label lbl = (Label)cell.FindControl("Label1");
    lbl.Text = "" + e.Row.Cells.GetNamedItem("FirstName").Text; // +"@gmail.com";
}

5. Create ShowWebCallOut() function in client-side to show WebCallOut in WebGrid.

function ShowWebCallOut(WebGridLabel)
{
    var callout = ISGetObject("WebCallOut1");
    var targetId = document.getElementById(WebGridLabel.id);
    var calloutContent = callout.GetContentElement();
            
    var span;
    var text;
            
    if (IS.ie)
    {
        span = calloutContent.childNodes[0].rows[1].cells[0].childNodes[0].rows[0].cells[0].childNodes[0]
        text = calloutContent.childNodes[0].rows[1].cells[0].childNodes[0].rows[0].cells[0].childNodes[2]
    }
    else
    {
        span = calloutContent.childNodes[1].rows[1].cells[0].childNodes[1].rows[0].cells[0].childNodes[1];
        text = calloutContent.childNodes[1].rows[1].cells[0].childNodes[1].rows[0].cells[0].childNodes[3];
    }
            
    span.innerText = WebGridLabel.innerText;
    text.nodeValue = WebGridLabel.innerText + "@gmail.com";
    window.setTimeout(function() {callout.ShowAutoDetect(targetId, true);}, 700); 
}

Hope this helps.