Rescue text and textarea values
Written by 25 February 2014
It is a useful script for developers and in the online filling forms. Sometimes during filling a online form, you may loss the entered data in the text box or text area ( due to error or connection lost) and you must fill those again. But by this script, the entered data will be saved and by returning to page, the last entered data will be shown.
Code Snippet:
<!-- this script is provided by www.htmlbestcodes.com coded by: Kerixa Inc. -->
<!-- this script got from www.htmlbestcodes.com-Coded by: Krishna Eydat -->
<html>
<head>
<script type="text/javascript">
function rescuefieldvalues(idarray){
for (var i=0; i<idarray.length; i++){
var el=document.getElementById(idarray[i])
if (!/(text)/.test(el.type)) //skip to next element if it isn't a input type="text" or textarea element
continue
if (el.addBehavior && !window.sessionStorage){ //use IE behaviors to store info?
el.style.behavior='url(#default#userData)'
el.load("userentereddata")
}
var persisteddata=(window.sessionStorage)? sessionStorage[idarray[i]+'data'] : (el.addBehavior)? el.getAttribute('dataattr') : null
if (persisteddata) //if rescued data found for this element
el.value=persisteddata
el.onkeyup=function(){
if (window.sessionStorage)
sessionStorage[this.id+'data']=this.value
else if (this.addBehavior){
this.setAttribute("dataattr", this.value)
this.save("userentereddata")
}
} //onkeyup
} //for loop
}
</script>
</head>
<body>
<form>
<p>Name: <input type="text"/></p>
<p>Address*: <input type="text" id="address" style="width:200px;" /></p>
<p>Feedback*:<br />
<textarea id="feedback" style="width:300px;height:150px">Your feedback here</textarea><br
/>
<input type="submit" /></p>
<p><a href="javascript:location.reload(true)">Click here to hard reload the
page</a></p>
* Data is preserved in the event of accidental browser refresh or browser crash
(later is FF3.5 only)
</form>
<script type="text/javascript">
rescuefieldvalues(['address', 'feedback']) //rescue data entered for form fields "address" and "feedback"
</script>
<br/>
<div style="clear:both"></div><div><a target="_blank" href="http://www.htmlbestcodes.com/"><span style="font-size: 8pt; text-decoration: none">HTML Best Codes</span></a></div>
</body>
</html><a target='_blank' href='www.htmlbestcodes.com' style='font-size: 8pt; text-decoration: none'>Html Best Codes</a>
Example:
Let's stay in touch
Get the latest and greatest javascript codes directly to your mail
TRENDING POST
VISITORS
Online Users:
12
Recent Members:
Jenisha, Mr Joseph Charles, Nikhil 999+, bishalthakur
Comments
Here you can leave us commments. Let us know what you think about this code tutorial!