Insert the value retrieved from localstorage to the input field

Question

I am using localStorage where in I am able to store in previous page and retrive it in this page. (Checked it using alert).

name12=localStorage.getItem("content");

Now my requirement is to display it into the input field and make it non-editable.

Please help me out with it. I have tried different things but I am not able to get it right.

Used onblur="localStorage.setItem(this.name, this.value) in the input tag

and also tried to use

if name_2.value = name12; in script tag 

Answer 1

To make a field uneditable, you can use the html attribute disabled on the input field. http://www.w3schools.com/tags/att_input_disabled.asp

To set a default value for a field, you can use the html attribute value. In your case since the value is dynamic, you probably want do not want to do that inline in the html. One possible solution is to set the value attribute through javascript like below.

<script type="text/javascript">
    var name2 = document.getElementById("name_2");
    name2.value = localStorage.getItem("content");;
</script>

Set the value of an input field

Answer 2

There are many places to find this information. Try reading the jquery documentation when you get stuck. For example, here is a page that describes how to set the value of an input element . StackOverflow also has many questions about this topic. A quick google search brings up this question about setting the value of input elements . We can also find SO questions about disabling input elements easily, like this one .

I encourage that you attempt to use more resources to find what you need before bringing your questions here.

Based on the answers to the questions I linked, we can set the input and then disable it to keep the value from changing:

$('#input').val(name12);
$('#input').prop('disabled', true);

Answer 3

You have to assign the value to input using javascript.

 <input username" id="name_2" type="text" placeholder="name" name="name_2" required="required" autofocus="autofocus"> <script> var n = "5"; // read from storage here var inpt = document.getElementById("name_2"); inpt.value = n; inpt.disabled = true; </script>