#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2013
    Posts
    21
    Rep Power
    0

    Use cookies to retain checkbox checked state


    Hi, I have a number of checkboxes with the name 'checkbox[0]', 'checkbox[1]', and so on.

    I want to save a cookie of the checkbox name if it is checked so that on page refresh, the checkboxes retain their checked state. The cookie can stay for 1 hour.

    Here is my code:

    Code:
    echo $row[$field3] . "<input type=\"checkbox\" value='$row[$field4]' name='checkbox[$y]'><br />";
    As you can see, the checkboxes are determined by PHP POST.

    Any help appreciated.
    Thank you.
    Daniel
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2013
    Posts
    21
    Rep Power
    0

    Talking Solved!


    I solved this using the following code.


    Code:
    <script type="text/javascript">
    //This Function Creates your Cookie for you just pass in the Cookie Name, Value, and number of days before you want it to expire.
    function CreateCookie(name,value,days)
    {
    	if (days)
    	{
    		var date = new Date();
    		date.setTime(date.getTime()+(days*24*60*60*1000));
    		var expires = "; expires="+date.toGMTString();
    	}
    	else var expires = "";
    	document.cookie = name + "=" + value + expires + "; path=/";
    }
    
    //This Function reads the value of a given cookie for you.  Just pass in the cookie name and it will return the value.
    function ReadCookie(name)
    {
    	var nameEQ = name + "=";
    	var ca = document.cookie.split(';');
    	for(var i=0;i < ca.length;i++) {
    		var c = ca[i];
    		while (c.charAt(0)==' ') c = c.substring(1,c.length);
    		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    	}
    	return null;
    }
    
    //This Function Erases Cookies.  Just pass in the name of the cookies you want erased.
    function EraseCookie(name)
    {
    	CreateCookie(name,"",-1);
    }
    
    //Sets or UnSets Cookies for given checkbox after it's been clicked on/off.
    function ChangeBox(CheckBox)
    {
    	if (document.getElementById(CheckBox).checked)
    	{
    		var CurrentCookie = ReadCookie("fabletwomaps");
    		CurrentCookie = CurrentCookie + CheckBox;	
    		CreateCookie("fabletwomaps",CurrentCookie,"100");
    	}
    	else
    	{
    		var CurrentCookie = ReadCookie("fabletwomaps");
    		CurrentCookie = CurrentCookie.replace(CheckBox,"");	
    		CreateCookie("fabletwomaps",CurrentCookie,"100");
    	}
    }
    
    //Runs on body load to check history of checkboxes on the page.
    function CheckCookies()
    {
    
    	var CurrentCookie = ReadCookie("fabletwomaps");
    
    	for (i=0; i<document.repeat.elements.length; i++)
    	{
    		if (document.repeat.elements[i].type == "checkbox")
    		{
    			document.repeat.elements[i].onclick = function() {ChangeBox(this.id);};
                if (CurrentCookie && CurrentCookie.indexOf(document.repeat.elements[i].id) > -1)
    			{
    				document.repeat.elements[i].checked = true;
    			}
    		}
    	}
    }
    
    //Clears Form
    function ClearBoxes()
    {
    	for (i=0; i<document.repeat.elements.length; i++)
    	{
    		if (document.repeat.elements[i].type == "checkbox")
    		{
    			document.repeat.elements[i].checked = false;
    			ChangeBox(document.repeat.elements[i].id);
    		}
    	}
    }
    
    //Deletes all cookies
    
    window.onload=CheckCookies;
    </script>

IMN logo majestic logo threadwatch logo seochat tools logo