-1

I need to make a quick webpage where a table is supposed to show with form boxes that allow you to enter data into the table. When a button is pressed, some javascript runs and a new row is added to the table, containing all of the information that was entered. I want to be able to enter this row at the bottom of the table every time I hit the button. But, to do this, I need to get ahold of the index of the last table row. Then, I need to be able to save that index somewhere on my webpage, so that if there is a refresh, the index is still there. Also, on refresh, I need to be able to view all of the data I had entered on the table using the javascript. How do I do this? 

    <!DOCTYPE html>
    <html>
    <head>
    <style>
        table, td {
    border: 1px solid black;
    }
    </style>
    </head>
    <body>

    <p>Click the button to add a new row at the first position of the table and then add cells and content.</p>

<table id="myTable">
  <tr>
    <td>Question Number</td>
    <td>Question Subject</td>
    <td>Answer</td>
    <td>Picture</td>
  </tr>
</table>
<br>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    var table = document.getElementById("myTable");
    var row = table.insertRow();
    var questionIndexNumber = row.insertCell
}
</script>

</body>
</html>

EDIT: I didn't post any code before just because i was doing research as to how i was going to get the project done. this is what i have so far.

Also, I forgot to add. Is there a way to be able to do it so that I can go to another computer and see the same stuff on the webpage?

Rahul Shah
  • 141
  • 2
  • 12

1 Answers1

0

You can use this to save a value to localstorage.

localStorage.setItem("xyz","hellooo")

and to retrieve 

localStorage.getItem("xyz")

You will not lose the value if you refresh.

Ajai
  • 901
  • 9
  • 21