Update record in database through checkbox and gridview

Question

Hi I have gridview inside gridview have checkbox. I want to update record in database after checked on gridview through jquery please help how can do this? The checkbox is is html input type. I want to update status like after click on checkbox status false then true or true then false ass well as update also in database table ? using jquery only ? please help?

Krishna Rajput Singh · Answer

Hello Davin Martyn below link helpful for you Thanks for writing happy http://www.c-sharpcorner.com/ http://codedisplay.com/how-to-use-checkbox-control-in-asp-net-gridview-to-update-database-c-vb-net/ http://stackoverflow.com/questions/13743747/update-database-on-checkbox-change-in-gridview-asp-net-c-sharp http://www.aspsnippets.com/Articles/Populate-bind-CheckBox-in-GridView-from-database-in-ASPNet-using-C-and-VBNet.aspx

Sabyasachi Mishra · Answer

Davin Martyn Simple use Ajax call for this. And provide more details while asking question what is your back end asp.net or MVC what is your db SQL Server/Oracle/My SQL etc. Better attach your sample code so that we will merge our code there. Not possible to do code for you from scratch. Hope that helps. Accept all the answer that helps you.

Sabyasachi Mishra · Answer

Try this var v = result.d[i].ID.ToString(); Hope that helps. Accept all the answer that helps you.

Davin Martyn · Answer

for ( var i = 0; i var v = result.d[i].ID; $( #tbDetails ).append(   + v +   + result.d[i].ReportName +   + result.d[i].ReportDescription +   + result.d[i].Status +   +   +   ); } I want to give the var v ; value in checkbox but the value of v is not appearing please help

Sabyasachi Mishra · Answer

If you have gone through the attached codes you can see I have used JQuery data-table plugins as per the below link https://www.datatables.net/examples/data_sources/dom.html You can see it provides everything like (Sorting Searching Pagination).I generally used this as it also supports bootstrap css and js. So what is need to use custom search with extra button and controls ? If you still need this I will try this for you on morning. Hope that helps. Accept all the answers that helps you.

Mukesh Kumar · Answer

Hi Refer this article which is same as you ask. Hope this will help you. http://codedisplay.com/how-to-use-checkbox-control-in-asp-net-gridview-to-update-database-c-vb-net/ thanks

Davin Martyn · Answer

Hello Mishra sir I have one problem actually I am bind the grid in button click like after search record through textbox then click on button all related record display in grid? Here is my code : script type =text/javascript> $(document).ready( function () { $( #btnShowData ).click( function () { var param = { str: $( '#txtCity' ).val() str1: $( '#Txt' ).val() }; $.ajax({ type: POST  contentType: application/json; charset=utf-8  url: Default3.aspx/BindEmployees  data: JSON.stringify(param) //data: {} dataType: json  success: function (result) { for ( var i = 0; i var v = result.d[i].ID; $( #example ).append(   + v +   + result.d[i].ReportName +   + result.d[i].ReportDescription +   + result.d[i].Status +   +  checkbox  class= chcktbl1  id= chcktbl1  name= chcktbl1  id= = result.d[i].ID%>  /> +  ); } } error: function (result) { alert( Error ); } }); }); }); please possible then update here ?

Sabyasachi Mishra · Answer

Hi Davin Marty Find the attached solution. Here I have used JQuery data-table so you can do all sorting searching and pagination. Also find the SQL attached for SQL query. For CRUD Operation through Ajax visit my article from the below link http://www.c-sharpcorner.com/UploadFile/145c93/crud-operations-using-ajax-part-2/ Hope that helps. Accept all the answer that helps you.

Sanjay Sabariya · Answer

your script code and webmethod code is ok . you have to add break point on your webmethod and check it call or not. public static void UpdateCustomer(int Id) { // break point on this line

Davin Martyn · Answer

Please check my script : script language =javascript type =text/javascript> $(document).ready( function () { $( 'input[type=checkbox]' ).click( function () { if ($( this ).is( ':checked' )) { var id = $( 'input[type=checkbox ]' ).val(); $.ajax({ url: Default3.aspx/UpdateCustomer  data: JSON.stringify(id) dataType: json  type: POST  contentType: application/json; charset=utf-8  success: function (data) { //write msg updated alert( Record successfully updated!!! ); //location.reload(); } }); } return false ; }); }); script > and my gridview given above :

Sanjay Sabariya · Answer

Please update your code like that .. public static void UpdateCustomer(int Id) { bool status = false; string constr = ConfigurationManager.ConnectionStrings[constr].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand(UPDATE report SET status = @status  WHERE Id = @Id)) { cmd.Parameters.AddWithValue(@Id Id); cmd.Parameters.AddWithValue(@ status  status ); cmd.Connection = con; con.Open(); cmd.ExecuteNonQuery(); con.Close(); } } } }

Davin Martyn · Answer

script language =javascript type =text/javascript> $(document).ready( function () { $( 'input[type=checkbox]' ).click( function () { if ($( this ).is( ':checked' )) { var id = $( 'input[type=checkbox ]' ).val(); $.ajax({ url: Default3.aspx/UpdateCustomer  data: JSON.stringify(id) dataType: json  type: POST  contentType: application/json; charset=utf-8  success: function (data) { //write msg updated alert( Record successfully updated!!! ); //location.reload(); } }); } return false ; }); }); script > AND METHOD : public static void UpdateCustomer( int Id) { string constr = ConfigurationManager .ConnectionStrings[ constr ].ConnectionString; using ( SqlConnection con = new SqlConnection (constr)) { using ( SqlCommand cmd = new SqlCommand ( UPDATE report SET status = @status WHERE Id = @Id )) { cmd.Parameters.AddWithValue( @Id  Id); cmd.Connection = con; con.Open(); cmd.ExecuteNonQuery(); con.Close(); } } } } Please check this is right if any problem then please update accordingly

Sanjay Sabariya · Answer

this is your ajax code to call a webmethod... $.ajax({ url: Default3.aspx/ UpdateCustomer  // this is your webmethod data: JSON.stringify(id)  // '{''id:'+id+'status:'+status+'}' you have to pass id and status like that dataType: json type: POST contentType: application/json; charset=utf-8 success: function (data) { //write msg updated alert(Record successfully updated!!!); //location.reload(); } }); When you get data in webmethod at time you are geting two variable Id Ans Status. it's wrong. So please update your code public static void UpdateCustomer( int Id int status ) { string constr = ConfigurationManager.ConnectionStrings[constr].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand(UPDATE report SET status = @status WHERE Id = @Id)) { cmd.Parameters.AddWithValue(@Id Id); cmd.Parameters.AddWithValue(@status status); cmd.Connection = con; con.Open(); cmd.ExecuteNonQuery(); con.Close(); } } }

Davin Martyn · Answer

Hello Sabyascahi any update?

Davin Martyn · Answer

Please describe what is exact web method ?

Sanjay Sabariya · Answer

hello davin have you successfully call your web method??? I have one doute in your code. you have pass a only id on you webmethod and you have to get id and status .

Sabyasachi Mishra · Answer

Davin Martyn Looking at your script it seems you are not using Asp.Net Server control GridView it is HTML Table if I am not wrong. Wait I am attaching the sample solution for this. Hope that helps. Accept all the answer that helps you.

Davin Martyn · Answer

This is my script : script language =javascript type =text/javascript> $(document).ready( function () { $( 'input[type=checkbox]' ).click( function () { if ($( this ).is( ':checked' )) { var id = $( 'input[type=checkbox ]' ).val(); $.ajax({ url: Default3.aspx/UpdateCustomer  data: JSON.stringify(id) dataType: json  type: POST  contentType: application/json; charset=utf-8  success: function (data) { //write msg updated alert( Record successfully updated!!! ); //location.reload(); } }); } return false ; }); }); script > WEBMWTHOD : public static void UpdateCustomer( int Id int status) { string constr = ConfigurationManager .ConnectionStrings[ constr ].ConnectionString; using ( SqlConnection con = new SqlConnection (constr)) { using ( SqlCommand cmd = new SqlCommand ( UPDATE report SET status = @status WHERE Id = @Id )) { cmd.Parameters.AddWithValue( @Id  Id); cmd.Parameters.AddWithValue( @status  status); cmd.Connection = con; con.Open(); cmd.ExecuteNonQuery(); con.Close(); } } } } I am using sqlserver asp.net and jquery Here is my code for gridview : $(document).ready( function () { $( #btnShowData ).click( function () { var param = { str: $( '#txtCity' ).val() str1: $( '#Txt' ).val() }; $.ajax({ type: POST  contentType: application/json; charset=utf-8  url: Default3.aspx/BindEmployees  data: JSON.stringify(param) //data: {} dataType: json  success: function (result) { for ( var i = 0; i var v = result.d[i].ID; $( #gvData ).append(   + v +   + result.d[i].ReportName +   + result.d[i].ReportDescription +   + result.d[i].Status +   +   +   ); } } error: function (result) { alert( Error ); } }); }); });