<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridViewDelete.aspx.cs" Inherits="GridViewDelete" %>
<!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>GridView and JQuery</title>
<style type="text/css">
.record{color:Green;}
.delbutton{color:Red;}
.Ex{color:Gray;}
</style>
<script type="text/javascript" src="
http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".delbutton").click(function () {
var record_id = $(this).attr("id");
var tr_id = $(this).parents(".record");
if (confirm("Do you want to delete this record?")) {
$.ajax({
type: "POST",
url: "GridViewDelete.aspx/DeleteUser",
data: "{'args': '" + record_id + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function () {
tr_id.css("background-color", "lightgreen");
tr_id.fadeOut(500, function () {
tr_id.remove();
});
}
});
}
return false;
});
$(".delbutton1").click(function () {
var record_id = $(this).attr("id");
document.getElementById('Hdid').value = record_id;
document.getElementById('btnsubmit').value = 'Update';
$("#<%=GridView1.ClientID %> tr").each(function () {
if (!this.rowIndex) return;
var age1 = $(this).find('td:first').html();
if (record_id == age1) {
document.getElementById('txtname').value = $(this).find('td:eq(1)').html();
document.getElementById('txtfname').value = $(this).find('td:eq(2)').html();
document.getElementById('txtlname').value = $(this).find('td:eq(3)').html();
}
});
});
$("#btnsubmit").click(function () {
var record_id = document.getElementById('Hdid').value
$.ajax({
type: "POST",
url: "GridViewDelete.aspx/adduser",
data: "{'args': '" + record_id + "', uname:'" + document.getElementById('txtname').value + "',fname:'" + document.getElementById('txtfname').value + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function () { }
});
if (record_id == 0) {
var stt = '<tr class=record ><td>15<td>' + document.getElementById('txtname').value + '</td>'+
'<td>' + document.getElementById('txtfname').value + '</td>'+
'<td>mname</td>'+
'<td>' + document.getElementById('txtlname').value + '</td>' +
'<td>Email</td>' +'<td> <a href=# id=15 class="delbutton">Delet</a></td>' +
'<td> <a href=# id=15 class="delbutton1">Edit</a></td>' +
'</tr>';
$('#<%=GridView1.ClientID %>').append(stt);
} else {
$("#<%=GridView1.ClientID %> tr").each(function () {
if (!this.rowIndex) return;
var age1 = $(this).find('td:first').html();
if (record_id == age1) {
$(this).find('td:eq(1)').html(document.getElementById('txtname').value);
$(this).find('td:eq(2)').html(document.getElementById('txtfname').value);
$(this).find('td:eq(3)').html(document.getElementById('txtlname').value);
}
});
}
document.getElementById('Hdid').value = 0;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table><tr>
<td>User Name</td><td><asp:TextBox ID="txtname" runat="server" ></asp:TextBox></td>
<td>First Name</td><td><asp:TextBox ID="txtfname" runat="server" ></asp:TextBox></td>
<td>Last Name</td><td><asp:TextBox ID="txtlname" runat="server" ></asp:TextBox></td>
<td>Last Name</td><td><input type="button" ID="btnsubmit" runat="server" value="save" />
<asp:HiddenField ID="Hdid" Value="0" runat="server" />
</td>
</tr></table>
<asp:GridView CellPadding="5" CellSpacing="5" ID="GridView1" runat="server" RowStyle-CssClass="record" AutoGenerateColumns="False" >
<RowStyle CssClass="record"></RowStyle>
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="User_Name" HeaderText="User Name" />
<asp:BoundField DataField="First_Name" HeaderText="First Name" />
<asp:BoundField DataField="Middle_Name" HeaderText="Middle Name" />
<asp:BoundField DataField="Last_Name" HeaderText="Last Name" />
<asp:BoundField DataField="Email_Id" HeaderText="Email Id" />
<asp:TemplateField>
<ItemTemplate>
<a href="#" id='<%# Eval("ID") %>' class="delbutton">Delet</a>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<a href="#" id='<%# Eval("ID") %>' class="delbutton1">Edit</a>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
==========================================================
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.Configuration;
using System.Data.SqlClient;
public partial class GridViewDelete : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LoadData();
}
}
[System.Web.Services.WebMethod]
public static void DeleteUser(string args)
{
string conString = ConfigurationManager.ConnectionStrings["MyConnection"].ConnectionString;
SqlConnection sqlConn = new SqlConnection(conString);
try
{
SqlCommand sqlCmd = new SqlCommand("DeleteUser", sqlConn);
sqlCmd.CommandType = CommandType.StoredProcedure;
sqlCmd.Parameters.AddWithValue("@id", Convert.ToInt32(args.Trim()));
sqlConn.Open();
sqlCmd.ExecuteNonQuery();
}
catch
{
//Handle Error
}
finally
{
sqlConn.Close();
}
}
[System.Web.Services.WebMethod]
public static void adduser(string args,string uname,string fname)
{
string conString = ConfigurationManager.ConnectionStrings["MyConnection"].ConnectionString;
SqlConnection sqlConn = new SqlConnection(conString);
try
{
SqlCommand sqlCmd = new SqlCommand("addUser", sqlConn);
sqlCmd.CommandType = CommandType.StoredProcedure;
sqlCmd.Parameters.AddWithValue("@id", Convert.ToInt32(args.Trim()));
sqlCmd.Parameters.AddWithValue("@uname", Convert.ToString(uname.Trim()));
sqlCmd.Parameters.AddWithValue("@fname", Convert.ToString(fname.Trim()));
sqlConn.Open();
sqlCmd.ExecuteNonQuery();
if (args == "0") {
// LoadData();
}
}
catch
{
//Handle Error
}
finally
{
sqlConn.Close();
}
}
private void LoadData()
{
string conString = ConfigurationManager.ConnectionStrings["MyConnection"].ConnectionString;
SqlConnection sqlConn = new SqlConnection(conString);
try
{
SqlCommand sqlCmd = new SqlCommand("GetUserRecords", sqlConn);
sqlCmd.CommandType = CommandType.StoredProcedure;
sqlConn.Open();
SqlDataReader rdr = sqlCmd.ExecuteReader();
GridView1.DataSource = rdr;
GridView1.DataBind();
rdr.Close();
}
catch
{
//Handle Error
}
finally
{
sqlConn.Close();
}
}
}
