c# - ASP.NET Dynamically built HtmlTable not updating server-side after Javascript changes and postback -


i have jagged array (int[][] arr) in server-side.

the table you're seeing in picture below represents content of array (1=red, 0=white , -1=black) , created dynamically via code-behind (c#).

after click on table cell, color changes via javascript script you're seeing below, , want update change server-side (i.e. update array next time run algorithm, take changes consideration).

i've tried nothing seems work far. 1 of main problems lose information htmltable holds after postback.

any suggestions on how implement this? thanks!

enter image description here

here's main part of client-side code:

<script type="text/javascript">     var red = "#e74c3c";     var black = "#000000";     var white = "#ffffff";       function cswap(cell) { //swaps colors of cells         if (cell.bgcolor == red) { //red white             cell.style.transitionduration = "0.1s";             cell.bgcolor = white;              (i = 0; < tablecontent.rows.length; i++) {                 (j = 0; j < tablecontent.rows[i].cells.length; j++) {                     if (cell.id == tablecontent.rows[i].cells[j].id) {                         tablecontent.rows[i].cells[j].bgcolor = white;                     }                 }             }          }         else if (cell.bgcolor == black) { //black red             cell.style.transitionduration = "0.1s";             cell.bgcolor = red;             (i = 0; < tablecontent.rows.length; i++) {                 (j = 0; j < tablecontent.rows[i].cells.length; j++) {                     if (cell.id == tablecontent.rows[i].cells[j].id) {                         tablecontent.rows[i].cells[j].bgcolor = red;                     }                 }             }         }         else if (cell.bgcolor == white) { //white black             cell.style.transitionduration = "0.1s";             cell.bgcolor = black;             (i = 0; < tablecontent.rows.length; i++) {                 (j = 0; j < tablecontent.rows[i].cells.length; j++) {                     if (cell.id == tablecontent.rows[i].cells[j].id) {                         tablecontent.rows[i].cells[j].bgcolor = black;                         }                 }             }         }     }  </script>  <title></title> </head> <body style="height: 287px; width: 1236px">     <form id="form1" runat="server">          <div draggable="auto" style="height: 618px">             <div id="autoassigndiv" draggable="auto" style="height: 34px">                 <asp:button id="autoassign" runat="server" onclick="autoassign_click" text="auto assign" width="112px" />                 <asp:button id="manualbutton" runat="server" onclick="manualbutton_click" text="manual" width="112px" />             </div>             <table id="tablecontent" border="1" runat="server"></table>             <div id="applydiv" draggable="auto" style="height: 34px">                 <asp:button id="apply" runat="server" text="apply" width="112px" onclientclick="settable();return false;" />                  <asp:scriptmanager id="scriptmanager" runat="server" />                     <asp:updatepanel runat="server" updatemode="conditional" id="updatepanel1">                         <contenttemplate>                             <asp:button runat="server" text="save" width="112px" id="savebutton" caption="save" onclientclick="updatearray();" onclick="savebutton_click"/>                         </contenttemplate>                             <triggers>                             <asp:asyncpostbacktrigger controlid="savebutton" eventname="click" />                                 </triggers>                     </asp:updatepanel>              </div>         </div>      </form>  </body> 


Comments