SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2005
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Using javascript to keep checkboxes checked

    I have the following function that either puts checkbox values into an array or removes them from the array when the checkbox tablecell is clicked.
    I want to add a function that checks if a value is in the array and if it is, the checkbox stays checked. The only way I can see how to do this is to loop through each checkbox value and see if it equals each value in the array but I can't quite see how to do this ie loop for each array value. Can anyone help? Thanks. The code is
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script>
    arr=new Array();
    function toggle(cell) { 
    	    var box = cell.getElementsByTagName('input')[0];
    		var doCheck = (box.checked =!box.checked);			  
    			  cell.style.backgroundColor = doCheck? 'blue' : ''; 		    
    			  if(box.checked){
    			  arr.push(box.value);			  
    			  }
    			 if(!box.checked){
    			 for(var i=0; i<arr.length; i++){
    			 if(arr[i]==box.value){
    			 arr.splice(i,1);
    			 }
    			 }
    			 
    			 }
    alert(arr);
    
    			   } 
    
    
    </script>
    </head>
    
    <body>
    <table width="250" border="1" cellpadding="0" cellspacing="0" bordercolor="#999999">
      <tr>
        <td onclick="toggle(this)"><input type="checkbox" name="checkbox" value="1"></td>
        <td onclick="toggle(this)"><input type="checkbox" name="checkbox" value="2"></td>
      </tr>
      <tr>
        <td onclick="toggle(this)"><input type="checkbox" name="checkbox" value="3"></td>
        <td onclick="toggle(this)"><input type="checkbox" name="checkbox" value="4"></td>
      </tr>
      
    </table>
    </body>
    </html>

  2. #2
    SitePoint Zealot
    Join Date
    Mar 2005
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think adapting something like this example will work.
    Code:
    arrayA = new Array(15,89,4,61,5) 
    arrayB = new Array(16,89,7,62,5) 
    
    for(i=0;i<arrayA.length;i++){ 
      for(j=0;j<arrayB.length;j++){ 
         if(arrayA[i]==arrayB[j]) 
            { 
              alert(arrayA[i]); 
            } 
       } 
    }

  3. #3
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I want to add a function that checks if a value is in the array and if it is, the checkbox stays checked. The only way I can see how to do this is to loop through each checkbox value and see if it equals each value in the array but I can't quite see how to do this
    Start with the function header:
    Code:
    function inArray(arrayToSearch, value)
    {
         .....
    }
    That function is defined to accept an array containing values(arrayToSearch) and a given value(value). Write the code to loop through the array to search for the value, and then return true or false.

    Then all you have to do is get a checkbox value and call the function to determine if it's in the array, e.g.

    if( inArray(myArray, aCheckBox) ) //do something


Bookmarks

Posting Permissions

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