Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Save inputfields with cookies

    Hi.

    I would like to save several input textfields and also dropdown selected options in to a cookie.

    Example:

    At the first page you would write in two textinputs, and select two options in a dropdown selector. Then click on the "Send button".

    You will be redicted to another page, and there you would see the data (like document.write) you wrote and selected.

    (Fill A-side with data, see the data on B-side)

    Can anyone help me how to do?

    Thanks!

  • #2
    Banned
    Join Date
    May 2005
    Location
    Midwest, U.S.
    Posts
    118
    Thanks
    1
    Thanked 26 Times in 23 Posts
    You don't need cookies to do that. Many user's have cookies blocked. The easiest way to "send" data from one page to the next is to build and append a "query string" to the second page URL:

    secondPage.html?text1=hello&text2=goodbye

    Just take a look at the address bar above, right now, there's a query string. The query string starts with the question mark.

    When you submit a form using the GET method instead of POST, it will automatically build the query string.

    Search this forum, or the internet for how to "read" or "parse" the query string.
    Last edited by Cranford; 09-03-2008 at 12:57 PM.

  • #3
    ess
    ess is offline
    Regular Coder
    Join Date
    Oct 2006
    Location
    United Kingdom
    Posts
    865
    Thanks
    7
    Thanked 29 Times in 28 Posts
    You should note that HTTP GET requests are not an ideal solution when processing large data (GET request data size is limited), or when data contains none-ascii characters.

    for more info, see http://www.cs.tut.fi/~jkorpela/forms/methods.html

    I would suggest that you post requests between pages and save user progress in hidden input fields such as

    Code:
    <input type="hidden" name="page1" value="_write value here" />
    Cheers
    ~E

  • #4
    Banned
    Join Date
    May 2005
    Location
    Midwest, U.S.
    Posts
    118
    Thanks
    1
    Thanked 26 Times in 23 Posts
    Here's an example. Main.html submits to Greeting.html

    Main.html:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Any Title</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    
    	
    </script>
    <style type="text/css">
    
    	 body {background-color: #eae3c6; margin-top: 60px;}
    	 form {width: 620px; margin: auto; font-family: times; font-size: 12pt;}
    	 fieldset {width: 620px; padding-left: 10px; background-color: #f0fff0; border: 1px solid #87ceeb;}
    	 legend {font-family: times; font-size: 14pt; color: #00008b; background-color: #87ceeb; padding-left: 3px; padding-right: 3px; margin-bottom: 5px;}
    	.submitBtn {font-family: tahoma; font-size: 10pt; display: block; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px;}
    
    </style>
    </head>
    	<body>
    		<form action="./Greeting.html" method="get">
    		   <fieldset>
    			<legend>Form</legend>
    				<select name="firstName">
    					<option value=""> Make a Selection </option>
    					<option value="Thomas"> Thomas </option>
    					<option value="Joseph"> Joseph </option>
    					<option value="Michael"> Michael </option>
    				</select>
    				<input type="text" name="lastName" value="Smith">
    				<input type="submit" name="submit" value="Submit" class="submitBtn">
    		   </fieldset>
    		</form>
    	</body>
    </html>
    Greeting.html:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Any Title</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    	
    	function init(){		
    
    		var names = location.search.substring(1,location.search.length).split('&');
    		var fName = names[0].substring(names[0].lastIndexOf('=')+1,names[0].length);
    		var lName = names[1].substring(names[1].lastIndexOf('=')+1,names[1].length);
    		document.forms[0]['lastName'].value = lName;
    		var nOpt = document.forms[0]['firstName'].options.length;
    		for (i=1; i<nOpt; i++)
    			{
    			 if (fName == document.forms[0]['firstName'][i].value)
    				{
    				 document.forms[0]['firstName'].selectedIndex = i;				 
    				}
    			}		
    	}
    
    	onload = init;
    	
    </script>
    <style type="text/css">
    
    	 body {background-color: #eae3c6; margin-top: 60px;}
    	 form {width: 620px; margin: auto; font-family: times; font-size: 12pt;}
    	 fieldset {width: 620px; padding-left: 10px; background-color: #f0fff0; border: 1px solid #87ceeb;}
    	 legend {font-family: times; font-size: 14pt; color: #00008b; background-color: #87ceeb; padding-left: 3px; padding-right: 3px; margin-bottom: 5px;}
    	.submitBtn {font-family: tahoma; font-size: 10pt; display: block; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px;}
    
    </style>
    </head>
    	<body>
    		<form action="" method="post">
    		   <fieldset>
    			<legend>Form</legend>
    				<select name="firstName">
    					<option value=""> Make a Selection </option>
    					<option value="Thomas"> Thomas </option>
    					<option value="Joseph"> Joseph </option>
    					<option value="Michael"> Michael </option>
    				</select>
    				<input type="text" name="lastName" value="Smith">
    				<input type="submit" name="submit" value="Submit" class="submitBtn">
    		   </fieldset>
    		</form>
    	</body>
    </html>


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •