CODEWITHSUNDEEP
javascripthtml
Sylvite
Sylvite

Reputation: 39

Saving data with HTML?

<p id="p2">Hello World!</p>
Enter Code:<br>
<input type="text" id="code" value="HTML">
<button onclick="myFunction()">Click me</button>
<script>
function myFunction() {
var jobValue = document.getElementById('code').value;
document.getElementById("p2").innerHTML = jobValue; }
</script>
</form>

Okay this HTML snippet takes the value form the textbox and then changes "Hello World!" into that value after you clicked "Click Me". But when Im running it on my host it wont save. What would I do to save the output even if I refresh the page?

Upvotes: 2

Views: 62

Answers (2)

brk
brk

Reputation: 50291

You can use localStorage to save and retrieve values in a key & value format. Here is a snippet

HTML

<p id="p2">Hello World!</p>
Enter Code:<br>
<input type="text" id="code" value="HTML">
<button onclick="myFunction()">Click me</button>
<!-- Just for testing-->
<button onclick="testStoredVal()">Check Stored Val</button>

JS

 function myFunction() {
    var jobValue = document.getElementById('code').value;
      if(typeof(Storage) !== "undefined") {
       localStorage.jobValue = jobValue;
    } else {
        // Sorry! No Web Storage support..
      }
    }

    // This function is just for testing
      function testStoredVal(){
        if(localStorage.jobValue == undefined){
        alert('No value Stored');  
       }
        else{
          alert(localStorage.jobValue);
        }
      }

EXAMPLE HERE

Upvotes: 1

Sachin
Sachin

Reputation: 1218

use cookies

document.cookie = code + "=" + jobValue + "; "

Upvotes: 0

Related Questions