c# - ASP.NET GridView - Click on a cell, edit, and update SQL Server database -

i working on asp.net web application in visual studio 2017. on 1 of .aspx web pages, have gridview displays table sql server.

i trying create controls user on client side can click on cell in gridview, cell turns textbox, user can put in new value, , upon leaving cell or pressing enter, gridview , sql server table update show new value.

in addition when cell clicked, delete row button generated. if delete row button clicked, row containing selected cell deleted gridview , sql server table.

lastly, there needs add row button @ bottom of gridview. clicking add row button creates new row in gridview, first cell of row turns textbox, user can put in value, , upon leaving cell or pressing enter, gridview , sql server table update show new row.

i dynamically generate gridview autogeneratecolumns="true" , bind gridview in code behind. if possible, keep way , not hardcode sql server table columns gridview.

here current markup gridview:

<asp:gridview id="gridviewjoblist" runat="server"      gridlines="none" forecolor="#333333" font-names="verdana"       font-size="9pt" emptydatatext=" "      onrowcommand="gridviewjoblist_rowcommand"        onrowdatabound="gridviewjoblist_rowdatabound">     <columns>         <asp:buttonfield commandname="cellclick" visible="false"></asp:buttonfield>     </columns>     <alternatingrowstyle backcolor="white" horizontalalign="left"                           verticalalign="middle" wrap="false" />     <editrowstyle horizontalalign="left" verticalalign="middle" wrap="false" />     <emptydatarowstyle wrap="false" />     <footerstyle backcolor="#1c5e55" font-bold="true" forecolor="white"                   horizontalalign="left" verticalalign="middle" wrap="true" />     <headerstyle backcolor="#1c5e55" font-bold="true" forecolor="white"                   horizontalalign="left" verticalalign="middle" wrap="true" />     <pagerstyle backcolor="#666666" forecolor="white" horizontalalign="center" />     <rowstyle backcolor="#e3eaeb" horizontalalign="left" verticalalign="middle" wrap="false" />     <selectedrowstyle backcolor="#c5bbaf" font-bold="true" forecolor="#333333" />     <sortedascendingcellstyle backcolor="#f8fafa" />     <sortedascendingheaderstyle backcolor="#246b61" />     <sorteddescendingcellstyle backcolor="#d4dfe1" />     <sorteddescendingheaderstyle backcolor="#15524a" /> </asp:gridview> 

here current c# code behind:

private static string squery, stable;  protected void page_load(object sender, eventargs e) {     if (!page.ispostback)     {             squery = null;             stable = "joblist";             squery = "select * [" + stable + "]";             gridviewsql();     } }  private void gridviewsql() {         try         {             gridviewjoblist.datasource = sqldb.dbdata(squery);             gridviewjoblist.databind();         }         catch (exception openex) { messagebox(openex.message); } }  protected void gridviewjoblist_rowdatabound(object sender, gridviewroweventargs e) {     if (e.row.rowtype == datacontrolrowtype.datarow)     {         linkbutton _singleclickbutton = (linkbutton)e.row.cells[0].controls[0];         string _jssingle = clientscript.getpostbackclienthyperlink(_singleclickbutton, "");          // add events each editable cell         (int columnindex = 0; columnindex < e.row.cells.count; columnindex++)         {             // add column index event argument parameter             string js = _jssingle.insert(_jssingle.length - 2, columnindex.tostring());             // add javascript onclick attribute of cell             e.row.cells[columnindex].attributes["onclick"] = js;             // add cursor style cells             e.row.cells[columnindex].attributes["style"] += "cursor:pointer;cursor:hand;";         }     } }  protected void gridviewjoblist_rowcommand(object sender, gridviewcommandeventargs e) {     if (e.commandname.tostring() == "cellclick")     {         int selectedrowindex = convert.toint32(e.commandargument.tostring());         int selectedcolumnindex = convert.toint32(request.form["__eventargument"].tostring());          var vselectedcell = gridviewjoblist.rows[selectedrowindex].cells[selectedcolumnindex];     } }  protected override void render(htmltextwriter writer) {     foreach (gridviewrow r in gridviewjoblist.rows)     {         if (r.rowtype == datacontrolrowtype.datarow)         {             (int columnindex = 0; columnindex < r.cells.count; columnindex++)             {                 page.clientscript.registerforeventvalidation(r.uniqueid + "$ctl00", columnindex.tostring());             }         }     }      base.render(writer); }  private void messagebox(string serror) //pop messagebox error messages in web browser {     string sscript = "alert(\"" + serror + "\");";     scriptmanager.registerstartupscript(this, gettype(), "servercontrolscript", sscript, true); } 

i novice programmer , have been trying figure out how on week no luck. assume solution combination of asp, c#, , javascript/jquery. comfortable @ making sql server connection in c# , using sql command update table in sql server. struggling javascript/jquery client side controls , getting correct information gridview in c# code behind use sql commands.

i have been able select gridview cell onclick example: http://www.dotnetlogix.com/article/aspnet/80/how-to-make-gridview-individual-cells-selectable.html

thank time.