Dragos Dobre
Dragos Dobre

Reputation: 15

Storing input field with jQuery

I have an input field with one text input and two buttons. What I want is for the user to type something in the field and then press "Save". If he refreshes the page, the input should be empty unless he presses on a second button "Restore", which should auto populate the input.

I managed to store the input in a variable, and then add it in the input. My problem is that the input is saved as an object, and displayed as an object... instead of a string. Here's my code:

var artist; 

$(document).ready(function(){   
        $(".save").click(function(){
           artist = $("#artist").val();
        });

        $(".reset").click(function(artist){
            $('#artist').val(artist);
        });
    });

Upvotes: 0

Views: 47

Answers (2)

guradio
guradio

Reputation: 15555

$("#Save").click(function () {
    var text = $("#text").val();
   localStorage.setItem('text', text);


});

$("#Restore").click(function () {
   var text = localStorage.getItem('text');
    console.log(text)
    $("#text").val(text);
});

DEMO

You need to use a place to store the value of text. When page refresh you can get it again. Local Storage is a good place to store. Demo will show how

Upvotes: 1

lewnelson
lewnelson

Reputation: 69

I haven't used it before but if you want to do all of this in JavaScript/jQuery then there is a library to handle cookies https://github.com/js-cookie/js-cookie. An alternative is to use your server side to set the cookie.

Upvotes: 0

Related Questions