Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 408
  • Last Modified:

How to persist data in static HTML Pages

Experts, please help:

So, I have two static html pages: A and B

A has two text boxes and a link at the bottom to HTML page B. And B also has two text boxes and a link to HTML page A. When user fill in the text boxes on page A and clicks on the link to B, he is directed to page B and upon clicking on the link to page A he returns to page A but the data should not be gone ( I just described a classic example of Persistent data). So here is the piece of code that I have for page A.

<meta NAME="save" CONTENT="snapshot">
<title>TPP Data Entry System</title>

<STYLE>  
  .saveSnapshot {behavior:url(#default#savesnapshot);}
</STYLE>
<form  name="form1" CLASS="saveSnapshot" ID="oPersistForm">


So, this code seems to be not working...can someone tell me what is wrong? I am also OK to do it differently as long as there is no need for a server to maintain the form data...not even IIS. Thank you all!
0
DoofuS
Asked:
DoofuS
  • 11
  • 6
  • 3
1 Solution
 
BadotzCommented:
"Introduced in IE5..."

Are you using IE or some other browser?
0
 
BadotzCommented:
Excerpted from http://msdn.microsoft.com/en-us/library/ms531066%28VS.85%29.aspx

"This feature requires Microsoft Internet Explorer 5 or later."


<!-- Tell the browser the page is persistent-->
<META NAME="save" CONTENT="favorite">
<!-- Define the class for the persistent object-->
<STYLE>
    .saveFavorite {behavior:url(#default#savefavorite);}
</STYLE>
<SCRIPT>
// Record information to the persistent object as an attribute.
function fnSave(){
   oPersistInput.setAttribute("sPersistAttr",oPersistInput.value);
}
// Retrieve information from a persistent object.
function fnLoad(){
   oPersistInput.value=oPersistInput.getAttribute("sPersistAttr");
}
</SCRIPT>
:
<!-- The CLASS enables the object to persist, the event handlers 
     fire the scripted functions.-->
<INPUT
   TYPE="text"
   CLASS="saveFavorite"
   ID="oPersistInput"
   onload="fnLoad()"
   onsave="fnSave()"
>

Open in new window

0
 
Dave BaldwinFixer of ProblemsCommented:
'behavior' is supported only in IE.  I don't know what the rest of that even means.

The only way I can think of to do what you want is to use javascript to set a cookie with the info on the first page and read it on the second page.
0
What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

 
BadotzCommented:
Like I said in the post above yours, "This feature requires Microsoft Internet Explorer 5 or later."
0
 
Dave BaldwinFixer of ProblemsCommented:
Yes, @Badotz, I was researching and typing still when you posted so I didn't see yours.  Lighten up.
0
 
BadotzCommented:
hmmm...page refresh before posting, you must. Avoid incurring snipes, you will ;-)
0
 
Dave BaldwinFixer of ProblemsCommented:
I often do that... but don't be making up new rules for others.  Live and let live.
0
 
DoofuSAuthor Commented:
:)...easy fellas.

So Badotz - I did try your code. See my code below... it is erroring out on fnSave() complaining about the curly brace.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta NAME="save" CONTENT="favorite">
<title>TPP Data Entry System</title>

<STYLE>
    .saveFavorite {behavior:url(#default#savefavorite);}
</STYLE>


<script language="VBScript">
      Sub ProcessPayroll()
            Dim myArray(4)
            Dim objShell
            Dim cmdParam
            Dim iSelectedIndex
            iSelectedIndex=(Document.form1.Designation.selectedindex)
            myArray(0)=(Document.form1.Name.Value)
            myArray(1)=int(Document.form1.Age.Value)
            myArray(2)=(Document.form1.Address.Value)
            myArray(3)=(Document.form1.Designation(iSelectedIndex).Text)
          cmdParam = Join(myArray, "###")
            Set objShell = CreateObject ("WScript.Shell")
            objShell.Run "D:\ExcelOperations.exe " & cmdParam
      End Sub
      
      function fnSave(){
            oName.setAttribute("sName",oName.value);
            oAge.setAttribute("sAge",oAge.value);
            oAddress.setAttribute("sAddress",oAddress.value);
            oDesignation.setAttribute("sDesignation",oDesignation.value);
}


function fnLoad(){
   oName.value=oName.getAttribute("sName");
   oAge.value=oAge.getAttribute("sAge");
   oAddress.value=oAddress.getAttribute("sAddress");
   oDesignation.value=oDesignation.getAttribute("sDesignation");
}
</script>
</head>

<body>
<form  name="form1" CLASS="saveSnapshot" ID="oPersistForm">
  <label>Name
  <input type="text" name="Name" CLASS="saveFavorite" ID="oName" onload="fnLoad()" onsave="fnSave()"/>
  </label>
 
  <label><br />
  <br />
  Age      
  <input type="text" name="Age" CLASS="saveFavorite" ID="oAge" onload="fnLoad()" onsave="fnSave()" />
  </label>
 
  <label><br />
  <br />
  Address
  <input type="text" name="Address" CLASS="saveFavorite" ID="oAddress" onload="fnLoad()" onsave="fnSave()" />
  </label>
 
  <label></label>
  <p>
    <label>Designation
    <select name="Designation" CLASS="saveFavorite" ID="oDesignation" onload="fnLoad()" onsave="fnSave()" >
      <option>ABC</option>
      <option>DEF</option>
      <option>GHI</option>
      <option>JKL</option>
    </select>
    </label>
    <input type="button" name="Submit" id="Submit" value="Submit" onclick="ProcessPayroll()"/>
  </p>
  <p>&nbsp;</p>
  <p><a href="Page2.html">Next</a></p>
</form>

</body>
</html>


Please let me know what is wrong in the code above. Thanks a lot for all of you guys...
0
 
BadotzCommented:
It doesn't like your mix of VBScript and JavaScript.
0
 
DoofuSAuthor Commented:
I dont think it has any issues with "mixing" VB Script and Javascript.
0
 
BadotzCommented:
Oh really?

Are you telling me that you can declare the script language to be VBScript, and then include JavaScript code in that same script block, and it will work?

Because if that is the case, your page should be working right now.
0
 
DoofuSAuthor Commented:
Sorry I did not mean to come across like that. Of course, I had corrected the code posted above....to close the script tag for vb script and reopen another tag for Javascript...duh me! What I meant was, even after doing that change, the page is not retaining any info. :-/. Here is the corrected code... thanks Badotz.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta NAME="save" CONTENT="favorite">
<title>TPP Data Entry System</title>

<STYLE>
    .saveFavorite {behavior:url(#default#savefavorite);}
</STYLE>



<script language ="javascript">      
      function fnSave(){
            oName.setAttribute("sName",oName.value);
            oAge.setAttribute("sAge",oAge.value);
            oAddress.setAttribute("sAddress",oAddress.value);
            oDesignation.setAttribute("sDesignation",oDesignation.value);
}


function fnLoad(){
   oName.value=oName.getAttribute("sName");
   oAge.value=oAge.getAttribute("sAge");
   oAddress.value=oAddress.getAttribute("sAddress");
   oDesignation.value=oDesignation.getAttribute("sDesignation");
}
</script>
</head>

<body>
<form  name="form1" CLASS="saveSnapshot" ID="oPersistForm">
  <label>Name
  <input type="text" name="Name" CLASS="saveFavorite" ID="oName" onload="fnLoad()" onsave="fnSave()"/>
  </label>
 
  <label><br />
  <br />
  Age      
  <input type="text" name="Age" CLASS="saveFavorite" ID="oAge" onload="fnLoad()" onsave="fnSave()" />
  </label>
 
  <label><br />
  <br />
  Address
  <input type="text" name="Address" CLASS="saveFavorite" ID="oAddress" onload="fnLoad()" onsave="fnSave()" />
  </label>
 
  <label></label>
  <p>
    <label>Designation
    <select name="Designation" CLASS="saveFavorite" ID="oDesignation" onload="fnLoad()" onsave="fnSave()" >
      <option>ABC</option>
      <option>DEF</option>
      <option>GHI</option>
      <option>JKL</option>
    </select>
    </label>
    <input type="button" name="Submit" id="Submit" value="Submit" onclick="ProcessPayroll()"/>
  </p>
  <p>&nbsp;</p>
  <p><a href="text.htm">Text Page</a></p>
</form>

</body>
</html>
0
 
BadotzCommented:
What browser are you using?
0
 
DoofuSAuthor Commented:
IE7
0
 
BadotzCommented:
Not much more I can do for you, sorry.
0
 
BadotzCommented:
Except to say: cookies persist info across page transitions. And they are browser-neutral, unlike this IE-specific crap :-/
0
 
DoofuSAuthor Commented:
OK...I did try to create cookies but failed. I dont have the code handy right now but will post it.. Do you think you can look into that or would that be another question? Thanks again for all ur time!
0
 
BadotzCommented:
That would be another question. And there are countless examples of cookie usage both here and on the 'net - a Google search should turn up a few million or so.
0
 
DoofuSAuthor Commented:
Although due to reasons unknown, the solution provided here is not working for me. But I am sure it would be helpful for others who'd have a similar question like mine. Thanks Badotz
0
 
BadotzCommented:
No worries - glad to help.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

  • 11
  • 6
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now