javascript cookie + display in form

**Logician** · Mar 21 '07, 03:59 PM

Originally posted by 848lu

hi, i wanted to display cookie info on a form, as in a text box

ok this is what im doing, im saving all info on a cookie where the users types in i.e. card details.

and at the end i made a confirmation page, where all the info they typed in are here.

so obviously we use cookie, but i wanted to display it in a text box.

how do i do that...

and one more thing, i also added a modify button on the confirmation page, where they can go back and edit, how do i retrieve the cookie to its original page?

please help

What aspect is causing a problem: Reading the cookie, parsing its data or writing the data into form elements?

**848lu** · Mar 21 '07, 07:00 PM

well...im habing trouble to display the info into a text file....

also from pull down menu to a text box....

**848lu** · Mar 22 '07, 01:46 PM

anyone please help?

**acoder** · Mar 22 '07, 03:15 PM

To change the value of a text box:

Code:

document.form.textbox.value="new value";

Post your code so we can suggest changes.

**848lu** · Mar 22 '07, 09:39 PM

Originally posted by acoder

To change the value of a text box:

Code:

document.form.textbox.value="new value";

Post your code so we can suggest changes.

i used this code to store the info in a cookie

Code:

function setCustomer_Details_Cookie()   {
	//works out the time value
            var expire = new Date()
	//gets the time value
            var oneHour = expire.getTime() + (60 * 60 * 1000)
            expire.setTime(oneHour)
        //saves it in a variable called USERTotal 
   	    USERname = document.name_form.Name_textfield.value
        //saves it in a cookie userTotalCookie to store
            document.cookie = "userNameCookie=" +USERname+ ";expires=" + expire.toGMTString()

     	USERHouseNo = document.name_form.HouseNo_textfield.value
            document.cookie = "HouseNo=" +USERHouseNo+ ";expires=" + expire.toGMTString()

and this to retrieve it

Code:

POS =  document.cookie.indexOf("USERname") 
TotalString = document.cookie.substring(POS+19,POS+16)

POS =  document.cookie.indexOf("USERHouseNo") 
TotalTicket = document.cookie.substring(POS+15,POS+16)

FORM NAME = myForm.Street_textfield.writeln(+ USERname )

**acoder** · Mar 23 '07, 08:54 AM

Read about setting and reading cookies here.

To set the value of the text field, try:

Code:

document.myForm.street_Textfield.value=readCookie('USERname');

where readCookie is the function defined in that link.

**848lu** · Mar 24 '07, 03:56 PM

nah sorry i cant get it to work....

it says it may not be a object

this is the whole coding of the HTML

[HTML]<html>
<head>
<title>Confirma tion Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaS cript" type="text/JavaScript">

document.HouseN o_textfield.val ue=readCookie(' HouseNo');

</script>
</head>

<body bgcolor="#FFFFC C">
<div id="Layer3" style="position :absolute; left:467px; top:405px; width:90px; height:49px; z-index:5"><a href="online%20 new%20-%2007%20-%20Reference.ht m"><img src="next_butto n.gif" width="31" height="21" border="0" align="right"> </a></div>
<div id="Layer1" style="position :absolute; left:16px; top:459px; width:573px; height:7px; z-index:4"><img src="status_06. jpg" width="574" height="55"></div>
<div id="Layer1" style="position :absolute; left:31px; top:72px; width:479px; height:309px; z-index:1">
<pre><font face="Geneva, Arial, Helvetica, sans-serif">Enter Customer details
Address
House no. <input name="HouseNo_t extfield" type="text" id="HouseNo_tex tfield" size="5">
</font><font face="Geneva, Arial, Helvetica, sans-serif">Street <input name="Street_te xtfield" type="text" id="Street_text field">
Postcode <input name="Postcode_ textfield" type="text" id="Postcode_te xtfield" size="10">
Contact number <input name="Contact_N umber_textfield " type="text" id="Contact_Num ber_textfield">

Card details
Account holders name <input name="Account_h olders_name_tex tfield" type="text" id="Account_hol ders_name_textf ield2">
Card no. <input name="Card_no_t extfield" type="text" id="Card_no_tex tfield2">
Card expiry date <select name="Card_expi ry_month_select " id="select3"><o ption>01</option><option> 02</option><option> 03</option><option> 04</option><option> 05</option><option> 06</option><option> 07</option><option> 08</option><option> 09</option><option> 10</option><option> 11</option><option> 12</option></select> <select name="Card_expi ry_year_select" id="select4"><o ption>2007</option><option> 2008</option><option> 2009</option><option> 2010</option></select>
Card start date <select name="Card_star t_month_select" id="select5"><o ption>01</option><option> 02</option><option> 03</option><option> 04</option><option> 05</option><option> 06</option><option> 07</option><option> 08</option><option> 09</option><option> 10</option><option> 11</option><option> 12</option></select> <select name="Card_star t_year_select" id="select6"><o ption>2007</option><option> 2008</option><option> 2009</option><option> 2010</option></select>
Card sort code <input name="Card_sort _code_textfield " type="text" id="Card_sort_c ode_textfield4" size="6"> <input name="Card_sort _code_textfield 2" type="text" id="Card_sort_c ode_textfield22 " size="6"> <input name="Card_sort _code_textfield 3" type="text" id="Card_sort_c ode_textfield32 " size="6">
Card security no. <input name="Card_secu rity_no_textfie ld" type="text" id="Card_securi ty_no_textfield 2" size="6">
Card type <select name="Card_type _select" id="Card_type_s elect"><option> Visa</option><option> Delta</option><option> Mastro</option><option> Master Card</option><option> Solo</option><option> Visa Electron</option></select>

</font></pre>
</div>
Confirmation
</body>
</html>[/HTML]

and here is where i wanted to insert the data
House no. <input name="HouseNo_t extfield" type="text" id="HouseNo_tex tfield" size="5">

**acoder** · Mar 26 '07, 07:49 AM

I assume you've already set the cookie. To check just alert document.cookie to check its contents.

You've not declared a form tag.

For the text field, run that code on page load so that the form exists, or at the bottom of the page. When it comes across the code, the text input box doesn't exist on the page, so it can't be set to the cookie value,

**848lu** · Mar 26 '07, 12:44 PM

ok i still cant get it to work, i have added myForm and also have tried without it...

can you write it for me

im really dumb at this

please i would really appreciate it

**848lu** · Mar 26 '07, 04:01 PM

Originally posted by acoder

I assume you've already set the cookie. To check just alert document.cookie to check its contents.

You've not declared a form tag.

For the text field, run that code on page load so that the form exists, or at the bottom of the page. When it comes across the code, the text input box doesn't exist on the page, so it can't be set to the cookie value,

ok this is what i have done now, i made new pages and made the first html page like this (where they enter the details)

<html>
<head>
<title>nter Customer details </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaS cript" type="text/JavaScript">

function setCustomer_Det ails_Cookie() {
//works out the time value
var expire = new Date()
//gets the time value
var oneHour = expire.getTime( ) + (60 * 60 * 1000)
expire.setTime( oneHour)
//saves it in a variable called USERTotal
USERname = document.myForm .Name.value
//saves it in a cookie userTotalCookie to store
document.cookie = "userNameCookie =" +USERname+ ";expires=" + expire.toGMTStr ing()

USERHouseNo = document.myForm .HouseNo.value
document.cookie = "HouseNo=" +USERHouseNo+ ";expires=" + expire.toGMTStr ing()
}

</script>

</head>

<body bgcolor="#FFFFC C">
<FORM NAME=myForm>
<font face="Geneva, Arial, Helvetica, sans-serif">Enter Customer details</font>
<br>
<br>
Name <INPUT SIZE =12 TYPE="text" name="Name">
<br>
<br>
House No <INPUT SIZE =12 TYPE="text" name="HouseNo">
<br>
<br>
<INPUT TYPE="button" VALUE="Process Order"
onClick="setCus tomer_Details_C ookie()">

<div id="Layer1" style="position :absolute; left:16px; top:459px; width:573px; height:7px; z-index:4"><img src="status_03. jpg" width="574" height="55"></div>
<div id="Layer3" style="position :absolute; left:467px; top:405px; width:90px; height:49px; z-index:5"><a href="online%20 new%20-%2006%20-%20Confirmation .htm"><img src="next_butto n.gif" width="31" height="21" border="0" align="right" onClick="setCus tomer_Details_C ookie()"></a></div>
</FORM>
</body>
</html>

and this is where it displays the data...

<html>
<head>
<title>Confirma tion Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaS cript" type="text/JavaScript">

document.open()
POS = document.cookie .indexOf("userN ameCookie")
Name = document.cookie .substring(POS+ 20,POS+15)

POS = document.cookie .indexOf("House No")
House = document.cookie .substring(POS+ 12,POS+8)

document.writel n("Name: "+ Name + " House no: "+ House)

document.myForm .Name.value=rea dCookie("Name") ;

document.close( )
</script>
</head>

<body bgcolor="#FFFFC C">
<FORM NAME=myForm>
Confirmation
<br>
<br>
<br>
Name <INPUT SIZE =12 TYPE="text" name="Name">
<br>
House No <INPUT SIZE =12 TYPE="text" name="HouseNo">
<br>
<br>

<div id="Layer3" style="position :absolute; left:467px; top:405px; width:90px; height:49px; z-index:5"><a href="online%20 new%20-%2007%20-%20Reference.ht m"><img src="next_butto n.gif" width="31" height="21" border="0" align="right"> </a></div>
<div id="Layer1" style="position :absolute; left:16px; top:459px; width:573px; height:7px; z-index:4"><img src="status_06. jpg" width="574" height="55"></div>

</FORM>
</body>
</html>

it worked fine, like it displayes what i typed in the 1st page, after i entered this but,

document.myForm .Name.value=rea dCookie("Name") ;

it says it is not a object

**iam_clint** · Mar 26 '07, 04:20 PM

don't make the textfields name Name because it is ambiguous change it to like fname or something then it will work.

**848lu** · Mar 26 '07, 05:37 PM

Originally posted by iam_clint

don't make the textfields name Name because it is ambiguous change it to like fname or something then it will work.

nah sorry it still dont work....

hey can anyone do this....

display the data but add new lines to it...the only one that i know of is \n and i have tried it like this...

document.writel n("Name: "+ Name + " \nHouse no: "+ House)
and
document.writel n("Name: "+ Name)
document.writel n("House no: "+ House)

but still don't show, it says...
document.myForm .CustomerName is null or not an object

**acoder** · Mar 27 '07, 10:28 AM

Why are using document.open() and close()?

The reason why you get the error is that the object/form does not exist.

You have to run the code on page load. Put it all in a function, then call it on body load, e.g.

Code:

window.onload=loadCookie;

where loadCookie is the name of your function.

**848lu** · Mar 27 '07, 11:52 AM

ok

i found another way....
this is very intresting, the way it is layed out....

document.open()
POS = document.cookie .indexOf("userN ameCookie")
Name = document.cookie .substring(POS+ 30,POS+15)
POS = document.cookie .indexOf("House No")
House = document.cookie .substring(POS+ 12,POS+8)
POS = document.cookie .indexOf("Stree tName")
StreetName = document.cookie .substring(POS+ 23,POS+11)
POS = document.cookie .indexOf("Postc ode")
Postcode = document.cookie .substring(POS+ 15,POS+9)
POS = document.cookie .indexOf("Conta ctNo")
ContactNo = document.cookie .substring(POS+ 21,POS+10)
POS = document.cookie .indexOf("Emerg encyNo")
EmergencyNo = document.cookie .substring(POS+ 23,POS+12)

POS = document.cookie .indexOf("Card" )
Card = document.cookie .substring(POS+ 15,POS+7)

POS = document.cookie .indexOf("expir ydate")
expirydate = document.cookie .substring(POS+ 15,POS+11)

POS = document.cookie .indexOf("start date")
startdate = document.cookie .substring(POS+ 14,POS+10)

POS = document.cookie .indexOf("sortc ode")
sortcode = document.cookie .substring(POS+ 14,POS+10)

POS = document.cookie .indexOf("secur ityno")
securityno = document.cookie .substring(POS+ 13,POS+9)

POS = document.cookie .indexOf("Cardt ype")
Cardtype = document.cookie .substring(POS+ 26,POS+12)

document.writel n("Confirmation ");
document.writel n("<br/>");
document.writel n("<br/>");
document.writel n("Name: "+ Name );
document.writel n("<br/>");
document.writel n("<br/>");
document.writel n("House no: "+ House);
document.writel n("<br/>");
document.writel n("Street: " +StreetName );
document.writel n("<br/>");
document.writel n("Postcode: "+ Postcode);
document.writel n("<br/>");
document.writel n("Contact No: "+ ContactNo );
document.writel n("<br/>");
document.writel n("Emergency No: "+ EmergencyNo);
document.writel n("<br/>");
document.writel n("<br/>");
document.writel n("Card Details");

document.writel n("<br/>");
document.writel n("Card No.: "+ Card);
document.writel n("<br/>");
document.writel n("Expiry date: "+ expirydate);
document.writel n("<br/>");
document.writel n("Start date: "+ startdate);
document.writel n("<br/>");
document.writel n("Sort code: "+ sortcode);
document.writel n("<br/>");
document.writel n("Security no: "+ securityno);
document.writel n("<br/>");
document.writel n("Card type: "+ Cardtype);
document.writel n("<br/>");

document.close( )

so it works...as long as it displayes the data it ok i guess...but i have to admit this site is really cool....like the people here really good help keep it up...

javascript cookie + display in form

javascript cookie + display in form

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment