Hello friends,
Now I am going to tellyou, how can we develop a program
for display image or text in gridview on mouse hover at a button or text using ajax tooltip control? I will be explaining
all steps one by one and Youn can download scourcecode for this project from here.
Step 1: First of all I will be design database,table and
strore procedure.
(1)database :
Create database
Testdata
(2) table:
CREATE TABLE [dbo].[Gallarydesc](
[id] [int] IDENTITY(1,1) NOT NULL,
[gallaryname] [nvarchar](50) NULL,
[creatdate] [datetime] NULL,
[status] [bit] NULL,
[thumbnails] [nvarchar](150) NULL,
CONSTRAINT
[PK_Gallarydesc] PRIMARY KEY CLUSTERED
(
[id] ASC
)WITH
(PAD_INDEX
= OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS
= ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
(3)Stroe Procedure:
Create PROCEDURE [dbo].[usp_gallary]
@Action nvarchar(50)='',
@name nvarchar(50)='',
As
Begin
if(@Action='insertgall')
begin
if exists(select * from Gallarydesc where
gallaryname=@name)
select'This
Album name already exists'as msg
else
insert into
Gallarydesc (gallaryname,status,creatdate) values(@name,'1',GETDATE())
select'Gallary
add to database successfully!'as msg
end
if(@Action='getallvisalbum')
begin
select *
from dbo.Gallarydesc
where status='1'
end
end
Step 2: Now Open Visual Studio and click File->New->website
Step 3: Now add Ajax .dll to project bin folder.
Step 4:Now create new page gallery.aspx. Right mouse Click
on top of root your project and add new page and on this page place a gridview and tooltip control inside
the gridview. That will be look like this.
<%@ Page
Language="C#"
AutoEventWireup="true"
CodeFile="managegallery.aspx.cs"
Inherits="managegallery"
%>
<%@ Register
Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit"
TagPrefix="asp"
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title><style type="text/css">
.modalBackground
{
background-color: Gray;
filter: alpha(opacity=80);
opacity: 0.8;
} .modalPopup
{
text-align:left;
border-width: 0px;
padding: 0px;
margin:0;
box-shadow:none;
margin-top:-15px;
background:#fff;
}
.PanelCSS
{ text-align:left;
visibility:hidden;
background:#fff;
padding:10px;
width:150px;
border:1px solid #000;
}
</style>
</head>
<body>
<form id="form1" runat="server"><fieldset><legend>Manage
Gallary</legend>
<div>
<asp:toolkitscriptmanager ID="Toolkitscriptmanager1" runat="server"></asp:toolkitscriptmanager>
<table width="950px"><tr>
<td>
<asp:GridView ID="gvDetails" runat="server"
AutoGenerateColumns="False" CssClass="Gridview"
ShowFooter="True"
onrowcommand="gvDetails_RowCommand" EnableModelValidation="True"
Width="750px">
<Columns>
<asp:TemplateField>
<EditItemTemplate>
<asp:ImageButton ID="imgbtnUpdate" CommandName="Update" runat="server" ImageUrl="Images/update.jpg" ToolTip="Update"
Height="20px"
Width="20px"
/>
<asp:ImageButton ID="imgbtnCancel" runat="server" CommandName="Cancel" ImageUrl="Images/Cancel.jpg" ToolTip="Cancel"
Height="20px"
Width="20px"
/>
</EditItemTemplate>
<ItemTemplate>
<asp:ImageButton ID="imgbtnEdit" CommandName="Edit" runat="server" ImageUrl="Images/Edit.jpg" ToolTip="Edit" Height="20px" Width="20px" />
<asp:ImageButton ID="imgbtnDelete" CommandName="Delete" Text="Edit" runat="server" ImageUrl="Images/delete.jpg" ToolTip="Delete"
Height="20px"
Width="20px"
/>
</ItemTemplate>
<FooterTemplate>
<asp:ImageButton ID="imgbtnAdd" runat="server" ImageUrl="Images/AddNewitem.jpg" CommandName="AddNew"
Width="30px"
Height="30px"
ToolTip="Add new
User" ValidationGroup="validaiton" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText=" Name"><ItemTemplate><asp:label ID="lblcomname"
runat="server" Text='<%#Eval("gallaryname") %>'></asp:label></ItemTemplate>
<EditItemTemplate><asp:Label ID="lbdeptid"
runat="server"
Text='<%#Eval("id") %>' Visible="false"></asp:Label> <asp:Label ID="lblid" runat="server"
Text='<%#Eval("ID") %>' Visible="false"></asp:Label><asp:TextBox ID="txtcom" runat="server"
Text='<%#Eval("gallaryname") %>'></asp:TextBox><asp:Label ID="img3" runat="server"
Text='<%#Eval("image") %>' Visible="false"></asp:Label></EditItemTemplate>
<HeaderStyle HorizontalAlign="Left"
/>
<ItemStyle HorizontalAlign="Left"
/>
<FooterTemplate><asp:TextBox ID="txtftrusrname"
runat="server"></asp:TextBox>
</FooterTemplate>
</asp:TemplateField><asp:TemplateField HeaderText="Upload File">
<ItemTemplate> <asp:Label ID="questionview" runat="server" Text="View"></asp:Label>
<asp:HoverMenuExtender ID="hme2" runat="Server"
TargetControlID="questionview"
PopupControlID="panel1"
HoverCssClass="popupHover"
PopupPosition="top"
OffsetX="0"
OffsetY="0"
PopDelay="50"
/><asp:Panel ID="panel1" runat="server"
CssClass="PanelCSS"><asp:Image ID="imgg" runat="server" ImageUrl='<%#Eval("image") %>' Width="150px"
Height="110px"
/> </asp:Panel></ItemTemplate>
<EditItemTemplate><asp:Label ID="img2" runat="server"
Text='<%#Eval("image") %>' Visible="false"></asp:Label>
<asp:FileUpload ID="fileupload2"
runat="server"
/>
</EditItemTemplate>
<HeaderStyle HorizontalAlign="Left"
/>
<ItemStyle HorizontalAlign="Left"
/>
<FooterTemplate><asp:FileUpload ID="fileupload1"
runat="server"
/>
</FooterTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle BackColor="#61A6F8"
Font-Bold="True"
ForeColor="White"
/>
</asp:GridView>
</div></fieldset>
</form>
</body>
</html>
Managegallery.cs:
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Collections;
using System.Data;
using System.IO;
using AjaxControlToolkit;
using System.Text;
public partial class managegallery
: System.Web.UI.Page
{
Hashtable hst = new
Hashtable();
DataTable dt = new
DataTable();
DataSet ds = new DataSet();
protected void
Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
bindgallery();
}
}
public void bindgallery()
{
hst.Clear();
dt.Clear();
ds.Clear();
hst.Add("Action", "getgalleryname");
// hst.Add("subjectid ",
ddlsub.SelectedValue.ToString());
// hst.Add("productid ",
ddlpro.SelectedValue.ToString());
ds =GetDataSet("[usp_gallary]", hst);
if (ds.Tables[0].Rows.Count > 0)
{
gvDetails.DataSource = ds;
gvDetails.DataBind();
}
else
{
ds.Tables[0].Rows.Add(ds.Tables[0].NewRow());
gvDetails.DataSource = ds;
gvDetails.DataBind();
int columncount = gvDetails.Rows[0].Cells.Count;
gvDetails.Rows[0].Cells.Clear();
gvDetails.Rows[0].Cells.Add(new TableCell());
gvDetails.Rows[0].Cells[0].ColumnSpan = columncount;
gvDetails.Rows[0].Cells[0].Text = "No
Records Found";
}
}
protected void
gvDetails_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName.Equals("AddNew"))
{
TextBox txtUsrname = (TextBox)gvDetails.FooterRow.FindControl("txtftrusrname");
hst.Clear();
dt.Clear();
ds.Clear();
hst.Add("Action", "insertgall");
hst.Add("Name ",
txtUsrname.Text.ToString());
string Msg = string.Empty;
Msg = Convert.ToString(ExecuteScalar("[usp_gallary]", hst));
if (Msg == "This
Album name already exists")
{
ScriptManager.RegisterStartupScript(this, GetType(), "showalert",
"alert('This Album name already
exists');", true);
}
else
{
ScriptManager.RegisterStartupScript(this, GetType(), "showalert",
"alert('Gallary add to database
successfully!');", true);
}
bindgallery();
}
}
}
public Object
ExecuteScalar(string spName, Hashtable hst)
{
con =
new SqlConnection();
cmd =
new SqlCommand();
con.ConnectionString = constr;
cmd.Connection = con;
cmd.CommandType = CommandType.StoredProcedure;
cmd.CommandText = spName;
con.Open();
if (hst != null)
if (hst.Count > 0)
AttachParameters(cmd, hst);
Object result = null;
result = cmd.ExecuteScalar();
con.Close();
return result;
}
public DataSet GetDataSet(string spName, Hashtable
hst)
{
con =
new SqlConnection();
cmd =
new SqlCommand();
con.ConnectionString = constr;
cmd.Connection = con;
cmd.CommandType = CommandType.StoredProcedure;
cmd.CommandText = spName;
con.Open();
if (hst != null)
if (hst.Count > 0)
AttachParameters(cmd, hst);
DataSet dataset = new
DataSet();
SqlDataAdapter adapter = new
SqlDataAdapter();
adapter.SelectCommand = cmd;
adapter.Fill(dataset);
con.Close();
return dataset;
}
private void
AttachParameters(SqlCommand command, Hashtable hstParameters)
{
try
{
IEnumerator parameters =
hstParameters.Keys.GetEnumerator();
while (parameters.MoveNext())
{
SqlParameter param = new SqlParameter();
param.ParameterName = "@" +
parameters.Current;
param.Value = hstParameters[parameters.Current];
command.Parameters.Add(param);
}
}
catch (Exception
exception)
{
HttpContext.Current.Response.Write("Error : " + exception.Message + " </br> Source : " + exception.Source);
}
}
Demo Screenshot of this tool tip is-
Excellent Work.........
ReplyDelete