Step1:
->Download AJAX Control Toolkit this below link
->Extract this.
Step2:
->Open vs.
->Go View.
->Select the Toolbox
->Go to below Toolbox
->Right click 'General' option
->Select Add Tab
->give the Name 'AJAX Control Toolkit
->Right click and Select choose item
->Go to location of AJAX Control Toolkit(That Extracted)
->Add 'AjaxControlToolkit.dll'
->Ok
Step3:
->Add the Register of top location
EX.
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>-> Add the Script Manager
EX
<asp:ToolkitScriptManager ID="ScriptManager1" runat="server"></asp:ToolkitScriptManager>-> Add ModelPopupExtender
Ex
<asp:ModalPopupExtender ID="MPE1" runat="server" TargetControlID="btnShowPopup" PopupControlID="panelpopup" CancelControlID="btnCancel"></asp:ModalPopupExtender>
Full Design
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ 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">
<asp:ToolkitScriptManager ID="ScriptManager1" runat="server"></asp:ToolkitScriptManager>
<div align="center">
<h1 style="color: green">Update and Delete Operation with Ajax Popup</h1>
</div>
<div align="center">
<asp:GridView Style="border: double; border-color: green; border-width: thick; border-radius: 15px; box-shadow: rgba(255, 0, 0, 0.73) 10px 10px 10px;" ID="grd1" runat="server" DataKeyNames="UserId" AutoGenerateColumns="False" BackColor="#CCCCCC" BorderColor="#999999" BorderStyle="Solid" BorderWidth="3px" CellPadding="4" CellSpacing="2" ForeColor="Black">
<Columns>
<asp:TemplateField HeaderText="Edit">
<ItemTemplate>
<asp:ImageButton ID="imgBtn" runat="server" ImageUrl="~/Image/edite.jpg" OnClick="imgBtn_Click" Width="70" Height="60" />
<asp:ImageButton ID="imgDelete" runat="server" ImageUrl="~/Image/images.jpg" OnClick="imgDelete_Click" Width="70" Height="60" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="UserName" HeaderText="UserName" />
<asp:BoundField DataField="FirstName" HeaderText="FirstName" />
<asp:BoundField DataField="LastName" HeaderText="LastName" />
<asp:BoundField DataField="City" HeaderText="City" />
<asp:BoundField DataField="Description" HeaderText="Description" />
<asp:BoundField DataField="PhoneNo" HeaderText="Phone Number" />
</Columns>
<FooterStyle BackColor="#CCCCCC" />
<HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#CCCCCC" ForeColor="Black" HorizontalAlign="Left" />
<RowStyle BackColor="White" />
<SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#808080" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#383838" />
</asp:GridView>
<br /><br />
<asp:Label ID="lblResult" runat="server" Font-Bold="true" Font-Size="XX-Large"></asp:Label>
<asp:Button ID="btnShowPopup" runat="server" Style="display: none" />
<asp:ModalPopupExtender ID="MPE1" runat="server" TargetControlID="btnShowPopup" PopupControlID="panelpopup" CancelControlID="btnCancel"></asp:ModalPopupExtender>
<asp:Panel ID="panelpopup" runat="server" BackColor="White" Height="269px" Width="400px" Style="display: none">
<table width="100%" style="border: Solid 3px green; width: 100%; height: 100%; border-radius: 15px; box-shadow: green 10px 10px;" cellpadding="0" cellspacing="0">
<tr style="background-color: black; border-radius: 15px 15px 15px;">
<td colspan="2" style="height: 10%; color: White; font-weight: bold; font-size: larger" align="center">User Details</td>
</tr>
<tr>
<td align="right" style="width: 45%">UserId:
</td>
<td>
<asp:Label ID="lblID" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td align="right">UserName:
</td>
<td>
<asp:TextBox ID="txtUserName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td align="right">FirstName:
</td>
<td>
<asp:TextBox ID="txtfname" runat="server" />
</td>
</tr>
<tr>
<td align="right">LastName:
</td>
<td>
<asp:TextBox ID="txtlname" runat="server" />
</td>
</tr>
<tr>
<td align="right">City:
</td>
<td>
<asp:TextBox ID="txtCity" runat="server" />
</td>
</tr>
<tr>
<td align="right">Description:
</td>
<td>
<asp:TextBox ID="txtDesg" runat="server" />
</td>
</tr>
<tr>
<td align="right">Fone Number:
</td>
<td>
<asp:TextBox ID="txtFone" runat="server" />
</td>
</tr>
<tr>
<td></td>
<td>
<asp:Button ID="btnUpdate" CommandName="Update" runat="server" Text="Update" OnClick="btnUpdate_Click" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</td>
</tr>
</table>
</asp:Panel>
<asp:Button ID="btnDelate" runat="server" Style="display: none" />
<asp:ModalPopupExtender ID="MPE2" runat="server" TargetControlID="btnDelate" PopupControlID="panelpopup1" CancelControlID="btnCancel"></asp:ModalPopupExtender>
<asp:Panel ID="panelpopup1" runat="server" BackColor="White" Height="269px" Width="400px" Style="display: none">
<table width="100%" style="border: Solid 3px green; width: 100%; height: 100%; border-radius: 15px; box-shadow: green 10px 10px;" cellpadding="0" cellspacing="0">
<tr style="background-color: black; border-radius: 15px 15px 15px;">
<td colspan="2" style="height: 10%; color: White; font-weight: bold; font-size: larger" align="center">user Detal</td>
</tr>
<tr>
<th align="center" colspan="2" style="color: red">Do You Want to Delete</th>
</tr>
<tr>
<th>User Name:</th>
<td>
<asp:Label ID="lbluserId" runat="server"></asp:Label></td>
</tr>
<tr>
<th>First Name:</th>
<td>
<asp:Label ID="lblFName" runat="server"></asp:Label></td>
</tr>
<tr>
<th>Last name:</th>
<td>
<asp:Label ID="lblLName" runat="server"></asp:Label></td>
</tr>
<tr>
<th>City:</th>
<td>
<asp:Label ID="lblCity" runat="server"></asp:Label></td>
</tr>
<tr>
<th>Description:</th>
<td>
<asp:Label ID="lblDec" runat="server"></asp:Label></td>
</tr>
<tr>
<th>Phone Number:</th>
<td>
<asp:Label ID="lblPhone" runat="server"></asp:Label></td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:Button ID="btnDelete" CommandName="Delete" runat="server" Text="Delete" OnClick="btnDelete_Click" />
<asp:Button ID="BtnCancel1" runat="server" Text="Cancel" />
</td>
</tr>
</table>
</asp:Panel>
</div>
</form>
</body>
</html>
And C# Code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{ SqlConnection con = null;
SqlCommand cmd = null;
SqlDataAdapter da = null;
DataSet ds = null;
string strCommand = null;
protected void Page_Load(object sender, EventArgs e)
{
con = new SqlConnection(@"Data Source=mithilesh;database=SystemTest;User Id=sa;Password=12345;");
if (!Page.IsPostBack)
{
BindData();
}
}
public void BindData()
{ strCommand = "select * from MKDetails";
da = new SqlDataAdapter(strCommand, con);
ds = new DataSet();
da.Fill(ds, "MKDetails");
grd1.DataSource = ds.Tables[0];
grd1.DataBind();
} protected void btnUpdate_Click(object sender, EventArgs e)
{
strCommand = "update MKDetails set UserName=@UserName,FirstName=@FirstName,LastName=@LastName,City=@City,Description=@Description,PhoneNo=@PhoneNo Where UserId=@UserId";
cmd = new SqlCommand(strCommand, con);
cmd.Parameters.AddWithValue("@UserName", txtUserName.Text.Trim());
cmd.Parameters.AddWithValue("@FirstName", txtfname.Text.Trim());
cmd.Parameters.AddWithValue("@LastName", txtlname.Text.Trim());
cmd.Parameters.AddWithValue("@City", txtCity.Text.Trim());
cmd.Parameters.AddWithValue("@Description", txtDesg.Text.Trim());
cmd.Parameters.AddWithValue("@PhoneNo", txtFone.Text.Trim());
cmd.Parameters.AddWithValue("@UserId",Convert.ToInt32(lblID.Text));
con.Open();
cmd.ExecuteNonQuery();
lblResult.Text = "[" + txtUserName.Text + "]" + " " + "<b>Details Update successfully</b>";
BindData();
lblResult.ForeColor = System.Drawing.Color.Green;
con.Close();
}
protected void imgBtn_Click(object sender, ImageClickEventArgs e)
{
ImageButton imgDetails = sender as ImageButton;
GridViewRow GDBR = (GridViewRow)imgDetails.NamingContainer;
lblID.Text = grd1.DataKeys[GDBR.RowIndex].Value.ToString();
txtUserName.Text = GDBR.Cells[1].Text;
txtfname.Text = GDBR.Cells[2].Text;
txtlname.Text = GDBR.Cells[3].Text;
txtCity.Text = GDBR.Cells[4].Text;
txtDesg.Text = GDBR.Cells[5].Text;
txtFone.Text = GDBR.Cells[6].Text;
this.MPE1.Show();
}
protected void btnDelete_Click(object sender, EventArgs e)
{
int userId = Convert.ToInt32(Session["UserId"]);
con.Open();
strCommand = "delete from MKDetails where UserId=" + userId;
cmd=new SqlCommand(strCommand,con);
if(cmd.ExecuteNonQuery()>0)
{
lblResult.Text="<b style='color:red>Delete the detail successfully</b>";
BindData();
}
con.Close();
}
protected void imgDelete_Click(object sender, ImageClickEventArgs e)
{
ImageButton imgDetails1 = sender as ImageButton;
GridViewRow GDBR1 = (GridViewRow)imgDetails1.NamingContainer;
Session["UserId"] = grd1.DataKeys[GDBR1.RowIndex].Value.ToString();
lbluserId.Text = GDBR1.Cells[1].Text;
lblFName.Text = GDBR1.Cells[2].Text;
lblLName.Text = GDBR1.Cells[3].Text;
lblCity.Text = GDBR1.Cells[4].Text;
lblDec.Text = GDBR1.Cells[5].Text;
lblPhone.Text = GDBR1.Cells[6].Text;
this.MPE2.Show();
}
}
OutPut: Details
Update:
No comments:
Post a Comment