AJAX HoverMenuExtender for Gridview Edit,Update,Delete


Code In ASPX page:

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head id="Head1" runat="server">
<title></title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.style1
{
width: 272px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
<table>
<tr><td class="style1"></td><td><asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
onrowediting="GridView1_RowEditing" CellPadding="4" ForeColor="#333333"
GridLines="None" onrowcancelingedit="GridView1_RowCancelingEdit"
onrowupdating="GridView1_RowUpdating" onrowdeleting="GridView1_RowDeleting">
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:TemplateField HeaderText="HoverMenuExample">
<ItemTemplate>
<asp:Panel CssClass="popupMenu" ID="PopupMenu" runat="server"
style="display:none">
<div style="border:1px outset white;padding:2px;">
<div><asp:LinkButton ID="LinkButton1" runat="server"
CommandName="Edit" Text="Edit" /></div>
<div><asp:LinkButton ID="LinkButton2" runat="server"
CommandName="Delete" Text="Delete" /></div>
</div>
</asp:Panel>
<asp:Panel ID="Panel9" runat="server">
<table width="100%">
<tr>
<td width="25%">
<asp:Label Font-Bold="true" ID="Label1" runat="server"
Text='<%#Eval("EmpNo") %>' /></td>
<td width="50%"><asp:Label ID="Label2" runat="server"
Text='<%# Eval("EmpName") %>' /></td>
<td width="25%"><asp:Label ID="Label3" runat="server"
Text='<%# Eval("EmpJob") %>' /></td>
<td width="25%"><asp:Label ID="Label4" runat="server"
Text='<%# Eval("EmpSal") %>' /></td>
</tr>
</table>
</asp:Panel>
<asp:HoverMenuExtender ID="hme2" runat="Server"
HoverCssClass="popupHover"
PopupControlID="PopupMenu"
PopupPosition="Right"
TargetControlID="Panel9"
PopDelay="25" />
</ItemTemplate>
<EditItemTemplate>
<asp:Panel ID="Panel9" runat="server" Width="100%">
<table width="100%">
<tr>
<td width="55%">EmpNo:<br /><asp:TextBox Font-Bold="true" ID="TextBox1" runat="server"
Text='<%# Eval("EmpNo") %>' Width="150" /></td>
<td width="55%">EmpName:<br /><asp:TextBox ID="TextBox2" runat="server"
Text='<%# Eval("EmpName") %>' Width="150" /></td>
<td width="55%">EmpJob:<br /><asp:TextBox ID="TextBox3" runat="server"
Text='<%# Eval("EmpJob") %>' Width="150" /></td>
<td width="55%">EmpSal:<br /><asp:TextBox ID="TextBox4" runat="server"
Text='<%# Eval("EmpSal") %>' Width="150" /></td>
</tr>
</table>
</asp:Panel>
<asp:HoverMenuExtender ID="hme1" runat="Server"
TargetControlID="Panel9"
PopupControlID="PopupMenu"
HoverCssClass="popupHover"
PopupPosition="Left" />
<asp:Panel ID="PopupMenu" runat="server" CssClass="popupMenu" Width="80">
<div style="border:1px outset white">
<asp:LinkButton ID="LinkButton1" runat="server"
CommandName="Update" Text="Update" />
<br />
<asp:LinkButton ID="LinkButton2" runat="server"
CommandName="Cancel" Text="Cancel" />
</div>
</asp:Panel>
</EditItemTemplate>
</asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#2461BF" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB" />
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel></td></tr>
</table>
</div>
</form>
</body>
</html>

Code Behind:

DatabaseModel.DatabaseEntities obj = new DatabaseModel.DatabaseEntities();
    Class1 obj3 = new Class1();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            Getdata();
        }
    }
    public void Getdata()
    {
        DatabaseModel.DatabaseEntities obj = new DatabaseModel.DatabaseEntities();
        var x = (from n in obj.Emps select n);
        GridView1.DataSource = x;
        GridView1.DataBind();
    }
    protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
    {
        GridView1.EditIndex = e.NewEditIndex;
        Getdata();
    }
    protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
    {
        TextBox Id = (TextBox)(GridView1.Rows[e.RowIndex].FindControl("TextBox1"));
        TextBox tbname = (TextBox)(GridView1.Rows[e.RowIndex].FindControl("TextBox2"));
        TextBox tbjob = (TextBox)(GridView1.Rows[e.RowIndex].FindControl("TextBox3"));
        TextBox tbsal = (TextBox)(GridView1.Rows[e.RowIndex].FindControl("TextBox4"));
        DatabaseModel.Emp obj1 = new DatabaseModel.Emp();
        obj1.EmpNo = int.Parse(Id.Text);
        obj1.EmpName = tbname.Text;
        obj1.EmpJob = tbjob.Text;
        obj1.EmpSal = Convert.ToDecimal(tbsal.Text);
        obj3.Update(obj1);
        GridView1.EditIndex = -1;
        Getdata();
    }
    protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
    {
        GridView1.EditIndex = -1;
        Getdata();
    }
    protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
    {
        Label Id = (Label)(GridView1.Rows[e.RowIndex].FindControl("Label1"));
        DatabaseModel.Emp obj2 = new DatabaseModel.Emp();
        obj2.EmpNo = int.Parse(Id.Text);
        obj3.Delete(obj2);
        Getdata();
        GridView1.EditIndex = -1;
    }

Code in Class1.cs:

    DatabaseModel.DatabaseEntities obj = new DatabaseModel.DatabaseEntities();
public Class1()
{
//
// TODO: Add constructor logic here
//
}

public void Update(DatabaseModel.Emp empdetails)
{
var x = (from n in obj.Emps
where n.EmpNo == empdetails.EmpNo
select n).FirstOrDefault();
if (x != null)
{
x.EmpName = empdetails.EmpName;
x.EmpJob = empdetails.EmpJob;
x.EmpSal = empdetails.EmpSal;
obj.SaveChanges();
}
}
public void Delete(DatabaseModel.Emp empid)
{
var x = (from n in obj.Emps
where n.EmpNo == empid.EmpNo
select n).FirstOrDefault();
if (x != null)
{
obj.DeleteObject(x);
obj.SaveChanges();
}
}

DownloadSamplecode

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s