Save The Input The User Make Even After Reload/refresh

I wanted to to add a function that every time the user refresh, reload or even close the page, the user to able to see the data whatever the user had entered previously or choose

Solution 1:

The localStorage and sessionStorage properties allow to save key/value pairs in a web browser.

The localStorage object stores data with no expiration date. The data will not be deleted when the browser is closed, and will be available the next day, week, or year.

The localStorage property is read-only.

Example:

localStorage.setItem("lastname", "Smith");
// Retrievedocument.getElementById("result").innerHTML = localStorage.getItem("lastname");

Solution 2:

If you want to store for example your data ya to local storage, you have to stringify the data, because localstorage accepts only string:

localStorage.setItem("savetab", JSON.stringify(ya));

to retrieve data, you do invers:

ya = JSON.parse(localStorage.getItem("savetab"));

after you rebuild your display yes ornoforeachrow/column

ya is an array of 12 columns and 6 rows so 72 selects

so when you loop over ya, you'll do something like that to reload all selects with data saved:

for(var row = 0; row < 6; row++){
     for(var col = 0; col < 12; col++){
       $("select").eq(row * 12 + col).val(ya[row, col] == 1 ? "Yes" : "No");
     }
   }

following your sample:

you execute the localStorage.setItem inside showAverages()

and before the last line you load the data saved

//restore your data here before calling the function averageshowAverages();

});