Here I have created sample that will help you out.
HTML
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
function addData() {
debugger;
var Customers = new Array();
var Employeeid = 0;
var Emplyeename = 'Name';
$('[id*=trans_gridview]').find('tr:has(td)').each(function () {
var Customer = {};
Customer.ID = $(this).find("td:nth-child(2)").html();
Customer.ProductName = $(this).find("td:nth-child(4)").html();
Customer.Amount = $(this).find("td:nth-child(5)").html();
Customer.Rate = $(this).find("td:nth-child(6)").html();
Customers.push(Customer);
});
$.ajax({
type: 'POST',
url: "Default.aspx/SaveGridViewRowData",
data: '{Customers: ' + JSON.stringify(Customers) + ',EmployeeId:"' + Employeeid + '",EmployeeName:"' + Emplyeename + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
if (response.d) {
alert('Data Saved Sucessfully');
return false;
}
}
});
};
</script>
<asp:Button Text="Save" runat="server" OnClientClick="addData()" />
</div>
Code
[WebMethod]
public static bool SaveGridViewRowData(List<Customerdata> Customers, int EmployeeId, string EmployeeName)
{
InsertEmployeedata(EmployeeId, EmployeeName);
// Write Here Code to insert Grid Data
return true;
}
[WebMethod]
public static void InsertEmployeedata(int EmployeeId, string EmployeeName)
{
if (EmployeeId > 0 && !string.IsNullOrEmpty(EmployeeName))
{
// Write Here code two insert
}
}
CustomerData Class
public class Customerdata
{
public int ID { get; set; }
public string ProductName { get; set; }
public decimal Amount { get; set; }
public decimal Rate { get; set; }
}
I hope this will help you out.