ASP.NET AJAX Hover menu doesnt load. I have a sample which i practice but is wasnt successful, i used the database of adventureworkds2012. i put a gridview in which when i hover some data will be show..
the output is the data i want to show to the extender doesnt load to the panel. it will directly load into the gridview without hover. the data will put the last column of the gridview.
here is my code
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxHoverMenuExtender.aspx.cs" Inherits="WebTest.AjaxHoverMenuExtender" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:GridView ID="GridView1" runat="server" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" AutoGenerateColumns="False" DataKeyNames="BusinessEntityID" DataSourceID="SqlDataSource1" OnRowCreated="GridView1_RowCreated">
<Columns>
<asp:BoundField DataField="BusinessEntityID" HeaderText="BusinessEntityID" ReadOnly="True" SortExpression="BusinessEntityID" />
<asp:BoundField DataField="NationalIDNumber" HeaderText="NationalIDNumber" SortExpression="NationalIDNumber" />
<asp:BoundField DataField="LoginID" HeaderText="LoginID" SortExpression="LoginID" />
<asp:TemplateField>
<ItemTemplate>
<asp:Panel ID="popup1" runat="server" BackColor="Yellow">
<asp:Label ID="lblORG" runat="server" Text=' <%# Eval("OrganizationLevel") %>'></asp:Label>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("JobTitle") %>'></asp:Label>
</asp:Panel>
<asp:HoverMenuExtender ID="hovermenu" runat="server" DynamicServicePath="" Enabled="True" PopupPosition="left" PopupControlID="popup1" TargetControlID="GridView1">
</asp:HoverMenuExtender>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:DBCS %>" SelectCommand="SELECT TOP 10 [BusinessEntityID], [NationalIDNumber], [LoginID], [OrganizationLevel], [JobTitle] FROM [Employee]"></asp:SqlDataSource>
</div>
</form>
</body>
</html>
CodeBehind File
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using AjaxControlToolkit;
namespace WebTest
{
public partial class AjaxHoverMenuExtender : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
HoverMenuExtender menu = (HoverMenuExtender)e.Row.FindControl("hovermenu");
e.Row.ID = e.Row.RowIndex.ToString();
menu.TargetControlID = e.Row.ID;
}
}
}
}