How To Refresh Tag In Javascript Using Google App Script

How can i refresh my table tag without reloading my page? In my current code, it refreshing but i notice that its like refreshing the whole document. I am trying to make a filter f

Solution 1:

You already have a showData() function that refreshes the data but doesn't refresh the page. You can use that to update your table. Currently, you have it setup to append row to your table table.append(). However, you will need to clear the table first without removing your headers as explained here.So the function would be modified like so:

functionshowData(things1) {
  var things = JSON.parse(things1);
  $('#tableShift2 tbody').remove(); //Remove Previous table, except headersvar table = $('#tableShift2');
  ... //Remaining code remains the same
}

Or you can create the headers also programmatically, with table.append() Next, you will need to modify the ApproveAndRefresh() and DeclineAndRefresh() functions so that showData() function is called on Success, like so:

function ApproveAndRefresh(data, data1){
  google.script.run.withSuccessHandler(showData)
  .setApproved(data, data1);
}

Finally, the setApproved and setDecline() currently return HTML content. However, they only need to return the getData() values like so:

functionsetApproved(a, b) {
  // You dont need the recreate the page var ss = SpreadsheetApp.openById('17lKIhONfEeNogsBhKtGr4zVaLgH0_199-3J3-0tAdcE');
  var sheet = ss.getActiveSheet();
  ... // The rest of the code remains same here
  ++statusIndex;
  sheet.getRange(sheetRow, statusIndex).setValue('Approved');

  returngetData()  //You just return values generated from getData()
}

Equivalently, you can just return spreadsheet data like so

 return JSON.stringfy(ss.getActiveSheet().getDataRange().getValues())