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 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Setting a cookie help

    I cannot get the cookie to save, I'm pretty new at web designing in general.
    If you could, the name of the cookie be cirulcook, also any advice you would have for me would be great!






    Code:
    <script><!--
    function SETcookie(){
    document.cookie="Selected="+document.getElementById('myList').selectedIndex;
    }
    function GETcookie(){
    if (document.cookie){
    eval(document.cookie);
    document.getElementById('myList').selectedIndex=Selected;
    }}// --></script>
    
    
    </head>
    
    
    
    <body onLoad="GETcookie()">
    <select id="myList" onChange="SETcookie()">
    
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    </select>
    Last edited by chauptman; 10-05-2011 at 10:22 PM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,731
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Code:
    <html>
    <head>
    
    <script type = "text/javascript">
    
    var expDate = new Date();
    expDate.setTime(expDate.getTime()+365*24*60*60*1000); // one year ahead
    
    function setCookie(isName,isValue,dExpires) {
    document.cookie = isName + "=" + isValue + ";expires=" + dExpires.toGMTString() + "path=/";
    }
    
    //The parameters of the function above hold the name of the cookie, the value of the cookie, and the number of days until the cookie expires.
    
    
    function getCookie(isName){
    cookieStr = document.cookie;
    startSlice = cookieStr.indexOf(isName+"=");
    if (startSlice == -1) {return false}
    endSlice = cookieStr.indexOf(";",startSlice+1);
    if (endSlice == -1){endSlice = cookieStr.length}
    isData = cookieStr.substring(startSlice,endSlice)
    isValue = isData.substring(isData.indexOf("=")+1,isData.length);
    return isValue;
    }
    
    function dispCookie(isName) {
    nValue = getCookie(isName);
    alert (nValue)
    if (nValue) {
    alert ("Cookie Found");
    }
    
    else {
    alert ("The Cookie was not found");
    }
    }
    
    </script>
    
    </head>
    
    <body onload = "dispCookie('myCookie')">
    
    <br><br>
    <!-- Button just for test purposes
     -->
    <input type = "button" value = 'Read Cookie' onclick = "dispCookie('myCookie')">
    
    <select id="myList" onchange="myCookieValue = 'Selected=' +  document.getElementById('myList').selectedIndex;  setCookie('myCookie', myCookieValue,expDate)">
    
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    </select>
    
    </body>
    </html>
    Change the cookie name "myCookie" to whatever you want. Likewise change the expiry date to the desired persistence (days, hours, whatever).

    Note that as your cookie is set onchange it will not be set unless the user selects something other than Option1. You should use something like "Select an option" to force the user the make a selection (change). Or of course make Option1 the default cookie value.

    Quizmaster: In vocabulary, what 'O' is a word that specifically refers to a person between 80 and 89 years of age?
    Contestant: Old.
    Last edited by Philip M; 10-05-2011 at 09:27 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    chauptman (10-05-2011)

  • #3
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts
    thank you so much! thats exactly what i needed, by any chance can you impliment a "submit button" instead of an on change?

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,731
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Just move

    setCookie('myCookie', myCookieValue, expDate); to the button.

    But why not keep it as it is? If the user changes his option the cookie will simply be over-written.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #5
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Because i am also trying to impliment another java script into it, where when the option is selected, it will also display an image. I can either get the picture working or the cookie, but neither at the same time

  • #6
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts
    This is what I have so far, I cannot seem to get the the picture to change, BUT the cookie for the drop down list is saving.


    Code:
    <html>
    <head>
    <SCRIPT LANGUAGE = "JavaScript">
    
    var expDays = 30;	
    
    function setCookie(name, val)
    {
    	var exp = new Date()
    	var cookieTimeToLive = exp.getTime() + (expDays * 24 * 60 * 60 * 1000)
    	exp.setTime(cookieTimeToLive)
    	document.cookie = name + "=" + escape(val) + "; expires=" + exp.toGMTString()
    }
    
    function getCookie(name)
    {
    	var cookieNameLen = name.length
    	var cLen = document.cookie.length
    	var i = 0
    	var cEnd
    	var myStringToReturn
    	var myStringToReturnLen
    	while (i < cLen) 
    	{
    		var j = i + cookieNameLen
    		if (document.cookie.substring(i,j) == name)
    		{
    			cEnd = document.cookie.indexOf(";",j)
    			if (cEnd == -1)
    			{
    				cEnd = document.cookie.length
    			}
    			myStringToReturn = unescape(document.cookie.substring(j,cEnd))
    			myStringToReturnLen = myStringToReturn.length
    			myStringToReturn = myStringToReturn.substring(1,myStringToReturnLen+1)
    			return myStringToReturn
    		}
    		i++
    	}
    	return ""
    }
    
    
    function setDefaultValues()
    {
    	var strCookieName, strCookieVal
    	var iFormsCount = 0
    	var iElementsCount = 0
    	for(iFormsCount=0;iFormsCount < document.forms.length;iFormsCount++)
    	{
    		for(iElementsCount=0;iElementsCount < document.forms[iFormsCount].elements.length;iElementsCount++)
    		{
    			strCookieName = document.forms[iFormsCount].elements[iElementsCount].name
    			strCookieVal = getCookie(strCookieName)
    			if (strCookieVal != null && !(isNaN(strCookieVal)) && strCookieVal != '')
    			{
    					document.forms[iFormsCount].elements[iElementsCount].selectedIndex = strCookieVal
    			}
    		}
    	}
    }
    
    </SCRIPT>
    
    
    
    
    
    
    <script language="javascript"
    
    function showimage()
    {
    if (!document.images)
    return
    document.images.pictures.src=
    document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value
    }
    //-->
    </script>
    
    
    </head>
    <body  onLoad="setDefaultValues()">
    
    
    <div align="center"> 
    <table border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td width="100%"><form name="mygallery"><p>
    <select name="picture" onChange="setCookie(this.name,this.selectedIndex)" size="1" onChange="showimage()">
    <option selected value="http://www.cirula.com/images/google.png">google</option>
    <option value="http://www.cirula.com/images/ebay.png">ebay</option>
    <option value="http://www.cirula.com/images/yahoo.png">yahoo</option>
    </select>
    </p>
    </form>
    </td>
    </tr>
    <tr>
    <td width="100%"><p align="center"><img src="http://www.cirula.com/images/google.png" name="pictures" width="150" height="150"></td>
    </tr>
    </table>
    </body>
    <br><br>
    <div align="center">
    
    </body>
    </html>
    Last edited by chauptman; 10-05-2011 at 09:01 PM.


  •  

    Posting Permissions

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