Cookie in a Form

[krose]

I have a question, it sounds like it should be easy, but I am new and confused

Basically I have a form where the user enters their info (name, last name, email) then clicks the add button to store their info into an array that I made. Then, the user can enter say... "Bill" in the first name field, click the search button, and in the text box, all results with bill will show up.

What I need to do is instead of the information being stored in the array when the user clicks add, is to store it as a cookie with a comma separated string like this: "lastname,firstname,emailid"
Then when the users clicks the search button, the info is retrieved from a cookie, not the array.

I hope that makes sense.

[pip]

What you could try is set the cookie in the following way:

firstname=john,surname=doe,email=john@doe.com

then, split the string back into an array, by comma. And then, each entry of the split array, you split by the equals (=) sign to get a name/value pair. Then read the name, get the value, set the field.

var aCookieVal = cookie.split(",");
for (var i = 0; i < aCookieVal.length; i++) {
  var aNameValPair = aCookieVal[i].split("=");
  var oField = eval("document.forms[0]." + aNameValPair[0]);
  if (oField) {
    oField.value = aNameValPair[1];
  }
}

Note... the code above was not tested... I just wrote it off the top of my head. Not sure if this is what you're looking for.

[krose]

Well, let me post the Javascript part of my code, maybe that can help me explain what I need

I basically need to replace the arrays with cookies. So when the user clicks add, the info is stored in a cookie, and when the user clicks search, the info is retrieved from the cookie.

var entryArray = new Array();

function addEntry( )
{
	//Variables from the form
    var firstNameElement = document.myform.firstname;
    var lastNameElement = document.myform.lastname;
    var emailElement = document.myform.email;

	var firstname = firstNameElement.value;
	var lastname = lastNameElement.value;
	var email = emailElement.value;

	//Validate values to make sure they aren't blank
	if (firstname == '')
	{
		alert("Please enter a First Name");
		return;
	}
	
	if (lastname == '')
	{
		alert("Please enter a Last Name");
		return;
	}
	
	if (email == '')
	{
		alert("Please enter an Email Address");
		return;
	}	
	
	//Validate names, convert to proper case, remove blanks
	firstname = firstname.replace(/ /, "");
	
	var firstname_1 = firstname.substr(0, 1);
	var firstname_1 = firstname_1.toUpperCase( );
	var firstname_rest = firstname.substr(1);
	var firstname_rest = firstname_rest.toLowerCase( );
	
	firstname = firstname_1 + firstname_rest;
	
	//alert(firstname);
	
	if(firstname.search(/[^a-zA-Z']/g) != -1)
	{
		alert("Only valid characters are letters and apostrophes");
		firstNameElement.focus( );
		return;
	}
	
	
	lastname = lastname.replace(/ /, "");
	
	var lastname_1 = lastname.substr(0, 1);
	var lastname_1 = lastname_1.toUpperCase( );
	var lastname_rest = lastname.substr(1);
	var lastname_rest = lastname_rest.toLowerCase( );
	
	lastname = lastname_1 + lastname_rest;
	
	if(lastname.search(/[^a-zA-Z']/g) != -1)
	{
		alert("Only valid characters are letters and apostrophes");
		lastNameElement.focus( );
		return;
	}
	
	
	//Validate email, convert to lower case
	email = email.replace(/ /, "");
	email = email.toLowerCase( );
	
	var position = email.indexOf('@') ;
	
	if(position == -1 ) 
    {
		alert("Email must have an @ in it");
		emailElement.focus( );
		return;
	} 
	else 
	{
		var position2 = email.indexOf('@', position + 1) ;
		if(position2 != -1 ) 
		{
		 	alert("You have more than one @ in the email address");
			emailElement.focus( );
			return;
		}
	}
	
	if(email.search(/[^a-z\d-_.@]/g) != -1)
	{
		alert("Only valid characters are letters, numbers, underscore, period, hyphen, and @ sign");
		emailElement.focus( );
		return;
	}
	
	if(email.search(/^[a-z]/) == -1)
	{
		alert("Email must begin with a letter");
		emailElement.focus( );
		return;
	}
	
	
	//Add to the array
	
	var elementString = firstname + "," + lastname + "," + email;
	
	var newIndex = entryArray.length;  //find the position of the last element in the array
	
	entryArray[newIndex] = elementString;   //add element to the array
	
}

function searchEntry( )
{
	var resultsElement = document.myform.results;
	
	resultsElement.value = "";
	
	var firstNameElement = document.myform.firstname;
    var lastNameElement = document.myform.lastname;
    var emailElement = document.myform.email;
	
	var firstname = firstNameElement.value;
	var lastname = lastNameElement.value;
	var email = emailElement.value;
	
	var resultString = "";


	for (index in entryArray)
	{
	   //split up element into array and individual elements
	    var myArray = entryArray[index].split(",");
		
		var firstname_fromarray = myArray[0];
		var lastname_fromarray = myArray[1];
		var email_fromarray = myArray[2];
	
		
		var fpattern = new RegExp("^" + firstname, "i");
		var lpattern = new RegExp("^" + lastname, "i");
		var epattern = new RegExp(email, "gi");
		
		var matched_element = "N";
		
		if (firstname != "")
		{
			if(fpattern.test(firstname_fromarray))
			{
				matched_element = "Y";
			}
		}
        
		if (lastname != "")
		{
			if(lpattern.test(lastname_fromarray))
			{
				matched_element = "Y";
			}
		}
		
		if (email != "")
		{		
			if(epattern.test(email_fromarray))
			{
				matched_element = "Y";
			}
		}
		
		if (matched_element == "Y")
		{
			resultString = resultString + firstname_fromarray + ", " + lastname_fromarray + ", " + email_fromarray + "\n"; 
		}
	}
	
	resultsElement.value = resultString;    //Set the text area with search mataches
	
}

[pip]

Right... well, in that case... I've just tested your script, and merely took the array object, and set a cookie equal the array object. When you retrieve the cookie again, and do an alert on the value, it has the same value as your resulting string. So, what you could do is, don't lose the arrays... keep them, and make use of the functionality. Retrieve the cookie value, set the array value to the cookie value, and do what you're currently doing in your search function.

function addEntry( ) {
  ...
  SetCookie("FormCookie",entryArray);
}

function searchEntry( ) {
  entryArray = new Array(GetCookie("FormCookie"));
  ...
}

function SetCookie(name, value) {

    var expireDate = new Date();
    expireDate.setDate(expireDate.getDate() + 40);

    var argv = SetCookie.arguments;
    var argc = SetCookie.arguments.length;
    var expires = (argc > 2) ? argv[2] : expireDate;
    var path = (argc > 3) ? argv[3] : "/";
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : true;
    document.cookie = name + "=" + escape (value) +
    ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
    ((path == null) ? "" : ("; path=" + path)) +
    ((domain == null) ? "" : ("; domain=" + domain)) +
    ((secure == null) ? "; secure" : "");
}

function GetCookie(name) {
    var arg = name + "=";
    var alen = arg.length;
    var clen = document.cookie.length;
    var i = 0;
    while (i < clen) {
        var j = i + alen;
        if (document.cookie.substring(i, j) == arg)
                return getCookieVal (j);
            i = document.cookie.indexOf(" ", i) + 1;
            if (i == 0) break; 
        }
    return null;
}

function getCookieVal(offset) {
    var endstr = document.cookie.indexOf (";", offset);
    if (endstr == -1)
        endstr = document.cookie.length;
    return unescape(document.cookie.substring(offset, endstr));
}

function DeleteCookie(name) {
    var exp = new Date();
    exp.setYear(exp.getYear() - 1);  // This cookie is history
    var cval = GetCookie(name);
    document.cookie = name + " = " + cval + "; expires=" + exp.toGMTString();
}

[krose]

sorry it took me so long to respond, but some things came up that kept me away from reality... but I just wanted to thank you for your help... The cookie code worked perfectly!! And keeping the arrays makes sense now that you explained it. Thanks!!!

[pip]

No sweat! Glad I could help!