Need the assistance of a Javascript Pro 1

nalbiso · Oct 17, 2000

Hi

This is an old question but I never received an answer that worked for my situation, or I just didn't understand the answer correctly. I am very new at javascript and I am attempting to write a cookie for a form that includes a visitor's name, address, phone number, email address so that each time the visitor returns to the form, this information is automatically filled out with the information left from before.

I tried this code once and it worked, but then I changed the expiration and it never worked again.

I believe that there is something wrong with the Get_Cookie(Name) and the Set_Cookie parts but I am very new to this and I haven't received an explanation as to why it's wrong and how to fix it

Here's the code:

<SCRIPT LANGUAGE="JavaScript"><!--
//"Cookie form values storage"
function Get_Cookie(name) {
var start = document.cookie.indexOf(name+"=&quot

;
var len = start+name.length+1;
if ((!start) && (name != document.cookie.substring(0,name.length))) return null;
if (start == -1) return null;
var end = document.cookie.indexOf(";",len);
if (end == -1) end = document.cookie.length;
return unescape(document.cookie.substring(len,end));
}

function Set_Cookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" +escape(value) +
( (expires) ? ";expires=" + expires.toGMTString() : "&quot

+
( (path) ? ";path=" + path : "&quot

+
( (domain) ? ";domain=" + domain : "&quot

+
( (secure) ? ";secure" : "&quot

;
}

function setupForm() {
if (userProfile) getValues(userProfile);
}
function getValues(string) {
getValue(string,"FirstLastName", document.ptsregb.FirstLastName, "text&quot

;
getValue(string,"EmailAddress", document.ptsregb.EmailAddress, "text&quot

;
getValue(string,"Program_Title", document.ptsregb.Program_Title, "select&quot

;
getValue(string,"Location", document.ptsregb.Location, "text&quot

;
getValue(string,"PhoneNumber", document.ptsregb.PhoneNumber, "text&quot

;

for (var i=0;i<7+1;i++)
getValue(string,"i"+i, eval("document.ptsregb.i"+i), "checkbox&quot

;
}
function onCheck(string) { if (string == "on&quot

return true; return false; }
function getValue(string,elementName,object,elementType) {
// gets value of elementName from string and populates object of elementType

var startPos = string.indexOf(elementName + "=&quot

if (startPos > -1) {
startPos = startPos + elementName.length + 1;
var endPos = string.indexOf("&",startPos);
if (endPos == -1) endPos = string.length;

var elementValue = unescape(string.substring(startPos,endPos));

if (elementType == "text&quot

object.value = elementValue;
if (elementType == "password&quot

object.value = elementValue;
if (elementType == "select&quot

object.selectedIndex = elementValue;
if (elementType == "checkbox&quot

object.checked = onCheck(elementValue);
if (elementType == "radio&quot

object[elementValue].checked = true;
}
}

//--></SCRIPT>

<title></title>

</HEAD>
<BODY onLoad="setupForm()" background="lt%20background.gif" bgproperties="fixed">

<SCRIPT LANGUAGE="JavaScript"><!--
//Establishes the Cookie Expiration Date
var today = new Date();
var expires = new Date(today.getTime() + (365 * 24 * 60 * 60 * 1000)); // expires one year from now
var userProfile = Get_Cookie("userProfile&quot

;

if (!userProfile) {
document.write('<P>Welcome,<P>According to your records ');
document.write('you have not set your user profile:');
}
else {
document.write('<P>Welcome back,<P>According to your records ');
document.write('the following settings are held in your profile:');
}
//--></SCRIPT>

Please help! This problem has and continues to plague me.

Thanks!

[sig][/sig]

rbobbitt · Oct 18, 2000

Hi,

I think that I might have been the one that responded to your original post.

Instead of addressing the problems with your script above, I've put together a sample script with form that provides the basic functionality that you refer to in the first paragraph of your post:

A page that remembers values for a given form with cookies and fills in these values automatically when the user returns to the site. I've included some comments that will (hopefully) be helpful.

Good luck!

<script language="javascript">
<!--

// Here you set the expiration date for each cookie you set. This will be passed to the
// Set_Cookie() function each time one of the form values is changed.
var expires=new Date();
expires.setTime (expires.getTime() + 24 *60 *60 *30 * 1000);

// I think I mentioned in my previous response to you that your Get_Cookie() function
// has a problem. It works for most cases, but will fail if you have, for example,
// two different cookie names that contain the same set of characters at the end. In
// other words, if you are looking for a cookie named "me" but ALSO have a cookie named
// "name" in the same set of cookies that occurs BEFORE "me" in the cookie string, a request
// for the "me" cookie will return the value for the "name" cookie. Try it out and you'll see
// what I mean and examine the code so you can see why this is so.
//
// Below is my own cookie retrieval function that doesn't have this problem:
function get_cookie(myname)
{
var start;
var end;
var last_cookie=false;
var wc;

for (start=0;!last_cookie;start=end+2) {
if ((end=document.cookie.indexOf(";",start))==-1) {
end=document.cookie.length;
last_cookie=true;
}
wc=unescape(document.cookie.substring(start,end));
if (wc.substring(0,wc.indexOf("=&quot

)==myname) {
return wc.substring(wc.indexOf("=&quot

+1);
}

}
return "";
}

// No problem here as long as you pass 'expires' the value that it wants (which
// we've taken care of above)
function Set_Cookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" +escape(value) +
( (expires) ? ";expires=" + expires.toGMTString() : "&quot

+
( (path) ? ";path=" + path : "&quot

+
( (domain) ? ";domain=" + domain : "&quot

+
( (secure) ? ";secure" : "&quot

;
}

// This function fills in the form with cookie values for the corresponding form elements
// if the cookies exist.
function fill_in_form(form_name)
{
var tmp;

// loop through each of the form elements
for (var i=0;i<document.forms[form_name].elements.length;++i) {
// This limits searches to just
// text boxes, this would obviously have to be changed if you wanted
// to include other form elements
if (document.forms[form_name].elements.type=="text&quot {
// does the cookie exist for this element?
if ((tmp=get_cookie(document.forms[form_name].elements.name))!="&quot {
// Yes, put it in the form
document.forms[form_name].elements.value=tmp;
}
}
}
}

//-->
</script>



<body onLoad="fill_in_form('user_info');">



<form name="user_info">
<pre>
name: <input type="text" name="name" onBlur="Set_Cookie('name',this.value,expires,null,null,null);">
address: <input type="text" name="address" onBlur="Set_Cookie('address',this.value,expires,null,null,null);">
phone: <input type="text" name="phone" onBlur="Set_Cookie('phone',this.value,expires,null,null,null);">
e-mail: <input type="text" name="email" onBlur="Set_Cookie('email',this.value,expires,null,null,null);">
</pre>
</form>
</body> [sig]<p>Russ<br><a href=mailto:bobbitts@hotmail.com>bobbitts@hotmail.com</a><br><a href=
http://home.earthlink.net/~bobbitts>Bobbitt
is in</a><br>[/sig]

nalbiso · Oct 18, 2000

Hi Russ,

If you're still out there, I am still having problems, but I think that I am half way there.

I was testing your code out on another webform that I have in a different website so I could see if it writes the cookie, which it was not doing before (I am assuming it was because of the name issue). I looked in my cookie file and it is writing there when I fill out the form.

But two things are happening. One, it is only taking the values from a radio button that I have on the form and I want it to take info from the radio button and the text boxes on the form. Two, the information is still not appearing when I reload the page which means that it is either not reading the correct cookie or I confused it somehow.
What else did I do wrong here?
_______________________________________________________________________
<script language="javascript"><!--
var expires=new Date();
expires.setTime(expires.getTime()+24*60*60*30*1000);
function get_cookie(jobint)
{
var start;
var end;
var last_cookie=false;
var wc;
for (start=0;!last_cookie;start=end+2){
if((end=document.cookie.indexOf(";",start))==-1){
end=document.cookie.length;
last_cookie=true;
}

}
return"";
}
// function fills out the form with the cookie values for the corresponding
// form elements

function Set_Cookie(name,value,expires,path,domain,secure){
document.cookie = name + "=" +escape(value) +
( (expires) ? ";expires=" + expires.toGMTString() : "&quot

+
( (path) ? ";path=" + path : "&quot

+
( (secure) ? ";secure" : "&quot

;
}
function fill_in_form(jobint)
{
var tmp;
// loop through each of the form elements
for (var i=0;i<document.forms[jobint].elements.length;++i){
if (document.forms[jobint].elements.type=="text&quot{
if (document.forms[jobint].elements.type=="radio&quot{
//does the cookie exist for this element?
if
((tmp=get_cookie(document.forms[jobint].elements.name))!=''){
//if yes, then put it in the form
document.forms[jobint].elements.value=tmp;
}
}
}
}
}
//-->
</script>


//This form was done with Frontpage2000 and I used the built in features for form field validation, so I put the onblur statements here.

<td width="199"><font face="Tahoma" color="#000080">Your First Name:
</font><font face="Tahoma" color="#FF0000">*R</font></td>
<td width="263" colspan="6"><font face="Tahoma" color="#000080">Your Last Name:</font><font face="Tahoma" color="#FF0000">*R</font></td>
</tr>
<tr>
<td width="199"><font face="Tahoma" color="#000080"><input type="text" name="First_Name" size="22" maxlength="40" tabindex="0"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="263" colspan="6"><font face="Tahoma" color="#000080"><input type="text" name="Last_Name" size="16" maxlength="40" tabindex="1"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
</tr>
<tr>
<td width="199"> <font face="Tahoma" color="#000080"> Street Address:</font></td>
<td width="97"><font face="Tahoma" color="#000080">City:</font></td>
<td width="61" colspan="3"><font face="Tahoma" color="#000080"> State:</font></td>
<td width="69"><font face="Tahoma" color="#000080">Zip Code:</font></td>
<td width="18"></td>
</tr>
<tr>
<td width="199"> <font face="Tahoma" color="#000080"> <input type="text" name="Address" size="22" tabindex="2"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="97"><font face="Tahoma" color="#000080"> <input type="text" name="City" size="13"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"> </font></td>
<td width="61" colspan="3"><font face="Tahoma" color="#000080"> <input type="text" name="State" size="2"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="69"><font face="Tahoma" color="#000080"><input type="text" name="Zip_Code" size="5"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="18"></td>
</tr>
<tr>
<td width="199"><font face="Tahoma" color="#000080">Exact Title of Position:
</font><font face="Tahoma" color="#FF0000">*R</font></td>
<td width="82" colspan="2">
<font face="Tahoma" color="#000080">
Job Code: </font>
<font face="Tahoma" color="#FF0000">
*R</font></td>
<td width="298" colspan="4" rowspan="2">
</td>
</tr>
<tr>
<td width="199"><font face="Tahoma" color="#000080"><input type="text" name="Title_of_Position" size="22" maxlength="60" tabindex="3">
</font></td>
<td width="56" colspan="2">
<font face="Tahoma" color="#000080">
<input type="text" name="Job_Code" size="4" tabindex="4" maxlength="4"></font></td>
</tr>
<tr>
<td width="454" colspan="7"><font face="Tahoma" color="#000080">Are you available to substitute in this position?</font></td>
</tr>
<tr>
<td width="184" colspan="4"><font face="Tahoma" color="#000080"> Yes <input type="radio" value="Yes" checked name="Available_to_Substitute" tabindex="5">
No<input type="radio" name="Available_to_Substitute" value="No" tabindex="6"></font></td>
<td width="264" colspan="3"></td>
</tr>
<tr>
<td width="184" colspan="4"><font face="Tahoma" color="#000080">Your Phone Number:</font></td>
<td width="264" colspan="3"></td>
</tr>
<tr>
<td width="184" colspan="4"><font face="Tahoma" color="#000080"> <input type="text" name="areacode" size="2" value="909" maxlength="3"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);">
<input type="text" name="Phone_Number1" size="2" maxlength="3"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);">-<input type="text" name="Phone_Number" size="4" tabindex="7" maxlength="4"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="264" colspan="3"></td>
</tr>
<tr>
<td width="184" colspan="4"><font face="Tahoma" color="#000080">Your email address:</font></td>
<td width="264" colspan="3"></td>
</tr>
<tr>
<td width="184" colspan="4"><font face="Tahoma" color="#000080"> <input type="text" name="Email_Address" size="19" tabindex="8"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
<td width="264" colspan="3"></td>
</tr>
<tr>
<td width="454" colspan="7"><font face="Tahoma" color="#000080">Which method do you prefer to be contacted by: </font></td>
</tr>
<tr>
<td width="454" colspan="7"><font face="Tahoma" color="#000080">Phone <input type="radio" name="Preferred_Method_of_Contact" value="Phone" tabindex="9"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);" checked>
Email <input type="radio" name="Preferred_Method_of_Contact" value="Email" tabindex="10"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);">
Regular Mail <input type="radio" name="Preferred_Method_of_Contact" value="Regular Mail" tabindex="11"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);">
All contact methods <input type="radio" name="Preferred_Method_of_Contact" value="All Contact Methods" tabindex="12"
onBlur="Set_Cookie('name',this.value,expires,null,null,null);"></font></td>
</tr>
</table>
<p><input type="submit" value="Submit" name="B1"><input type="reset" value="Reset" name="B2"></p>
</form>

_______________________________________________________________________

Thanks for your help!

[sig][/sig]

rbobbitt · Oct 20, 2000

Your first problem is that removed the most important part from your get_cookie() function. Compare the one I posted to yours and you'll see what I mean. Yours will always return "".

Your second problem is that in your fill_in_function() you first test for type "text" and then you test the same element for type "radio." Therefore, no element will pass the test as no element can be both "text" AND "radio." The comparison and assignments should be something like:

if (document.forms[form_name].elements.type=="text" ||
document.forms[form_name].elements.type=="radio&quot {
// does the cookie exist for this element?
if ((tmp=get_cookie(document.forms[form_name].elements.name))!="&quot {
if (document.forms[form_name].elements.type=="radio&quot {
if (document.forms[form_name].elements.value==tmp) {
document.forms[form_name].elements.checked=true;
}
} else {
document.forms[form_name].elements.value=tmp;
}
}
}

The other problem I saw was that each of your calls to Set_Cookie() overwrites the previous one, due to the fact that you use the same value for the name of the cookie. Just code each of your Set_Cookie() calls like this:

Set_Cookie(this.name,this.value,expires,null,null,null);

There may be other problems, but try this out and see if it works. [sig]<p>Russ<br><a href=mailto:bobbitts@hotmail.com>bobbitts@hotmail.com</a><br><a href=
http://home.earthlink.net/~bobbitts>Bobbitt
is in</a><br>[/sig]

nalbiso · Oct 20, 2000

Hi Russ.

I tried what you said, but I still get the following errors.

JavaScript Error:

http://misnt1/classpers/jobint_copy(2).asp,

line 40:

syntax error.

if (document.forms[jobint].elements.type=="text&quot||
............................................................^

JavaScript Error:
http://misnt1/classpers/jobint_copy(2).asp,
line 65:

fill_in_form is not defined.
JavaScript Error:
http://misnt1/classpers/jobint_copy(2).asp,
line 46:

syntax error.

if (document.forms[jobint].elements.type=="radio&quot{
........^

JavaScript Error:
http://misnt1/classpers/jobint_copy(2).asp,
line 70:

fill_in_form is not defined.

I'll keep working on it, but let me know if you have any ideas.

Thanks

[sig][/sig]

rbobbitt · Oct 21, 2000

if (document.forms[jobint].elements.type=="text&quot

||

should be:

if (document.forms[jobint].elements.type=="text" ||

** given that 'i' is your element counter

if (document.forms[jobint].elements.type=="radio&quot{

again, you need the index for the element:

if (document.forms[jobint].elements.type=="radio&quot{

check to make sure that 'fill_in_form()' is the name of the function you're calling and that you're calling it by its EXACT name. [sig]<p>Russ<br><a href=mailto:bobbitts@hotmail.com>bobbitts@hotmail.com</a><br><a href=
http://home.earthlink.net/~bobbitts>Bobbitt
is in</a><br>[/sig]

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Need the assistance of a Javascript Pro 1

nalbiso

Programmer

rbobbitt

Programmer

nalbiso

Programmer

rbobbitt

Programmer

nalbiso

Programmer

rbobbitt

Programmer

Similar threads

Part and Inventory Search

Sponsor