Insert, Update, Delete in Database through GridView using ModalPopupExtender control of Ajax in ASP.NET with C# - Example

Introduction:-

Insert, Update, Delete in Database through GridView using ModalPopupExtender control of Ajax in ASP.NET with C# - Example
Introduction:-
              Here I want to provide Insert, Update and Delete Operation in Gridview using ModelPopupExtender Control of Ajax Toolkit 3.0.
when you click on "Edit" link button or "Insert" Button The Popup Window will Open which has proper controls to edit or insert data.
In this case I got requirement to create a gridview with edit and insert operation when user click on edit or insert link button it displays one popup in that popup I have provided interface to edit or insert new record.

To implement this requirement I had created one panel in which I had provided two textboxes to insert or edit data and two buttons to submit changes or cancel. I had given this panel’s id in popup control of ModelPopupExtender.

            


Source Code(in asp.net):-


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Popup.aspx.cs" Inherits="Popup" %>

<%@ 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 id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        .ModalPopupBG
        {
            background-color: #C0C0C0;
            filter: alpha(opacity=50);
            opacity: 0.7;
        }
        .DetailPopup
        {
            min-width: 200px;
            min-height: 150px;
            background: white;
        }
        .detailpopup1
        {
            font-size: larger;
            font-weight: bold;
            font-style: normal;
            color: #000000;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager>
    <asp:HiddenField ID="hid" runat="server" />
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
        ForeColor="#333333" GridLines="None">
        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
        <Columns>
            <asp:TemplateField HeaderText="Pid">
                <ItemTemplate>
                    <asp:Label ID="lpid" runat="server" Text='<% #Eval("pid")%>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Name">
                <ItemTemplate>
                    <asp:Label ID="lpname" runat="server" Text='<% #Eval("pname")%>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Description">
                <ItemTemplate>
                    <asp:Label ID="ldes" runat="server" Text='<% #Eval("des")%>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:LinkButton ID="lbedit" runat="server" OnClick="lbedit_Click">Edit</asp:LinkButton>
                    &nbsp;<asp:LinkButton ID="lbdel" runat="server" OnClick="lbdel_Click">Delete</asp:LinkButton>
                    &nbsp;
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <EditRowStyle BackColor="#999999" />
        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    </asp:GridView>
    <asp:Button ID="bntinsert" runat="server" Text="Insert" OnClick="bntinsert_Click" />
    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="hid"
        PopupControlID="pan" BehaviorID="bntinsert_Click" PopupDragHandleControlID="PopupHeader"
        Drag="true" BackgroundCssClass="ModalPopupBG">
    </asp:ModalPopupExtender>
    <asp:Panel runat="server" ID="pan">
        <table class="DetailPopup">
            <tr>
                <td colspan="2">
                    <h1>
                        <asp:Label ID="lpopuphead" runat="server" Text=""></asp:Label></h1>
                </td>
            </tr>
            <tr>
                <td>
                    Product Name:-
                </td>
                <td>
                    <asp:TextBox ID="txtpnm" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Plz Enter Product Name"
                        ControlToValidate="txtpnm" ValidationGroup="vpopup"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td>
                    Product Description:-
                </td>
                <td>
                    <asp:TextBox ID="txtpdes" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Plz Enter Description"
                        ControlToValidate="txtpdes" ValidationGroup="vpopup"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Button ID="btnOkay" runat="server" Text="OK" OnClick="btnOkay_Click" ValidationGroup="vpopup" />
                    <asp:Button ID="btnCncle" runat="server" Text="CANCLE" OnClick="btnCncle_Click" />
                </td>
            </tr>
        </table>
    </asp:Panel>
    </form>
</body>
</html>



 Codebehind(in C#):-



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Popup : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            grbind();
        }
    }

    protected void grbind()
    {
        GridView1.DataSource = Data_of_Grid("select * from aby_Productnew");
        GridView1.DataBind();
    }
    protected void lbedit_Click(object sender, EventArgs e)
    {
        LinkButton lb = (LinkButton)sender;
        GridViewRow gr = (GridViewRow)lb.NamingContainer;

        Label lpid1 = (Label)gr.FindControl("lpid");
        hid.Value = lpid1.Text;

        Label lpname1 = (Label)gr.FindControl("lpname");
        txtpnm.Text = lpname1.Text;

        Label ldes1 = (Label)gr.FindControl("ldes");
        txtpdes.Text = ldes1.Text;

        lpopuphead.Text = "Edit Record";
        ModalPopupExtender1.Show();

    }

    protected void lbdel_Click(object sender, EventArgs e)
    {
        LinkButton lb = (LinkButton)sender;
        GridViewRow gr = (GridViewRow)lb.NamingContainer;
        Label lpid1 = (Label)gr.FindControl("lpid");
        Cmd_Non_Query("delete from aby_Productnew where pid=" + lpid1.Text);
        grbind();
    }

    protected void btnOkay_Click(object sender, EventArgs e)
    {
        if (Page.IsValid)
        {
            if (lpopuphead.Text.Equals("Edit Record"))
            {
                Cmd_Non_Query("update aby_Productnew set pname='" + txtpnm.Text + "', des='" + txtpdes.Text + "' where pid=" + hid.Value);
            }
            else
            {
                Cmd_Non_Query("insert into aby_Productnew values('" + txtpnm.Text + "','" + txtpdes.Text + "')");
            }
            grbind();
        }
        clr();
   }

    private void clr()
    {
        lpopuphead.Text = "";
        txtpdes.Text = "";
        txtpnm.Text = "";
    }

    protected void bntinsert_Click(object sender, EventArgs e)
    {
        lpopuphead.Text = "Insert Record";
        ModalPopupExtender1.Show();
    }

    protected void btnCncle_Click(object sender, EventArgs e)
    {
        clr();
        ModalPopupExtender1.Hide();
    }

    public DataTable Data_of_Grid(string q)
    {
        DataTable dt = new DataTable();
        try
        {
           if (con.State == ConnectionState.Closed)
            {
               con.Open();
            }
            SqlCommand cmd = new SqlCommand(q, con);
            SqlDataAdapter sd = new SqlDataAdapter();
            sd.SelectCommand = cmd;
            sd.Fill(dt);
        }
        catch (Exception err)
        {
            //TODO
        }
        finally
        {
            con.Close();
        }
        return dt;
    }

    public void Cmd_Non_Query(string q)
    {
        try
        {
            SqlCommand cmd = new SqlCommand(q, con);
            if (con.State == ConnectionState.Closed)
            {
                con.Open();
            }
            cmd.ExecuteNonQuery();
        }
        catch (Exception err)
        {
        }
        finally
        {
            con.Close();
        }
    }
}

2 comments

Post a Comment