How to save the selected option in the selection list

Question

For my web application, I have a selection list encoded below:

<select name = 'job' id = 'job'> <option value = 'jobselect'>Select Profession</option> <option value = 'job1'>Mechanical Engineer</option> <option value = 'job2'>Software Engineer</option> <option value = 'jobother'>Other</option> </select> 

on the settings page. this page is associated with the save.js file, where it is assumed that user input will be saved. I use HTML and JavaScript - and I don't know PHP. In my JS file, I have two functions - saveSettings and loadSettings. I am stuck on how to save it in localStorage (JavaScript) in the saveSettings function and read it back to the user in loadSettings. Any help would be greatly appreciated thanks x

Answer 1

To save changes:

 <script> document.addEventListener('DOMContentLoaded', function () { var input = document.getElementById('job'); if (localStorage['job']) { // if job is set input.value = localStorage['job']; // set the value } input.onchange = function () { localStorage['job'] = this.value; // change localStorage on change } }); </script> 

For individual methods:

 var input = document.getElementById('job'); function loadSettings() { if (localStorage['job']) { input.value = localStorage['job']; } } function saveSettings() { localStorage['job'] = input.value; } 

Answer 2

 var name_of_var = document.getElementById('job').value; 

then u will get the selected value if you want to set globally in javacsript use this

  name_of_var = document.getElementById('job').value;