HTML forms remember last value
HTML forms remember last value
Is it possible to replicate the behavior of "Remember last value" in an HTML form? If so, how? I have a pretty extensive form created, but every time the connector is launched, the fields are empty. Is there a Javascript trick or something to be done on Switch or ConnectALL? Thanks!
Re: HTML forms remember last value
I was able to accomplish this using Javascript and cookies. If anyone knows an easier, more direct way please let me know.
Re: HTML forms remember last value
Is it possible to share your javascript? It could be useful for others having the same issue.
Re: HTML forms remember last value
I tried to cleanup the code to provide just the relevant information, so I can't guarantee this will work as provided. Basically, I run onload="checkCookie()" to check if any cookies are saved (getCookie) and populate the form fields if they exist. Any changes to a field automatically updates the cookies (setCookie). There's probably a more efficient way to do this, but it works for me so I'm chalking it up as a win.
Code: Select all
<html xmlns:EnfocusConnectNS="http://www.enfocus.com/2013/EnfocusConnectMetadataPreset">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function setCookie(cookie) {
document.cookie = cookie.id + "=" + encodeURIComponent(cookie.value) + ";expires=Tue, 1 Jan 2030 00:00:00 UTC; path=/";
}
function getCookie(cname) {
var name = cname + "=";
var decodedCookie = document.cookie;
var ca = decodedCookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = decodeURIComponent(ca[i]);
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
function checkCookie() {
var elements = document.getElementById("enfocusForm").elements;
for (var i = 0, element; element = elements[i++];) {
var cookieValue = getCookie(element.id);
if (cookieValue != "") {
document.getElementById(element.id).value = cookieValue;
}
}
}
function getJobInfo(jobAttribute) {
let urlParams = new URLSearchParams(window.location.search);
return urlParams.get(jobAttribute);
}
</script>
</head>
<body onload="checkCookie()">
<form action="http://localhost" method="post" autocomplete="on" id="enfocusForm" novalidate="" name="EnfocusConnectMetadata" enctype="application/x-www-form-urlencoded">
<div>
<ul>
<li id="cid_1" data-type="control_head">
<div>
<div>
<h1 id="header_1" data-component="header">
Connect Uploader
</h1>
</div>
</div>
<center><h4><script>document.write(getJobInfo("jobname"));</script></h4></center>
</li>
<li id="id_name">
<label id="label_name" for="name">Your name</label>
<div id="cid_name">
<input type="text" id="name" name="name" data-type="input-textbox" size="20" value="" data-component="textbox" onchange="setCookie(this)" />
</div>
</li>
</ul>
</div>
</form>
</body>
</html>