Come faccio a ripristinare una tabella HTML5 con jQuery?

Question

Ho una tabella in HTML scritto in quanto tale:

<table id="spreadsheet" class="table table-striped" cellspacing="0" width="100%"> 
 
    \t <thead> 
 
    \t \t <tr> 
 
    \t \t \t <th id="spreadsheet-year">2015</th> 
 
    \t \t \t <th>Month (Est)</th> 
 
    \t \t \t <th>Month (Act)</th> 
 
    \t \t \t <th>YTD (Est)</th> 
 
    \t \t \t <th>YTD (Act)</th> 
 
    \t \t \t <th>Full Year (Est)</th> 
 
    \t \t \t <th>Full Year (Act)</th> 
 
    \t \t </tr> 
 
    \t </thead> 
 
    \t <tbody> 
 
    \t \t <tr> 
 
    \t \t \t <td>Jan</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td>Feb</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td>Mar</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td>Apr</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t \t <td>0</td> 
 
    \t \t </tr> 
 
      ... 
 
      ... 
 
      ... 
 
    \t </tbody> 
 
    </table>

Il che mi dà questo:

Io uso this script per rendere il tavolo interattivo. Funziona abbastanza bene, ma mi chiedo come farei per reimpostare il tavolo dopo che la modal è stata inviata o chiusa? Altrimenti gli stessi valori rimarranno quando l'utente apre nuovamente la modale.

Answer 1

modo più semplice sarebbe quella di clonare prima di modificarlo, ma dopo plugin di inizializzazione:

var $defaultTable = $('#spreadsheet').clone(true); 

Poi ogni volta che è necessario resettarlo, uso:

$('#spreadsheet').replaceWith($defaultTable); 

EDIT Per gestire Reseting multipla , è necessario clonarlo quando lo si sostituisce anche per non lavorare su una copia modificata, ad esempio:

$('#spreadsheet').replaceWith($defaultTable.clone(true));