Member Avatar for Asimina

Hi guys,

i have a for and lets say 4 checkboxes

i want to get the values of the checkboxes that are checked & to get the values of the checkboxes that are not checked.

so if someone check the A & C checkbox i will get that A&C has this value (because they are checked!) and B,&D has this value(because they are not checked)

example this is my table....

<table >
  <tr>
    <td><label><input type="checkbox">A</label></td>
    <td><label><input type="checkbox">B</label></td>
    <td><label><input type="checkbox">C</label></td>
    <td><label><input type="checkbox">D</label></td>
  </tr>
</table>

thanks in advance :) :)

Edited by Asimina because: n/a
  • 3 Contributors
  • 2 Replies
  • 340 Views
  • 12 Hours Discussion Span
  • Latest Post Latest Post by essential
Member Avatar for McLaren 
<!DOCTYPE html>
<html>
<head>
  <style>
  div { color:red; }
  </style>
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
  <form>
    


<table >
  <tr>
    <td><label><input id = "A" type="checkbox">A</label></td>
    <td><label><input type="checkbox">B</label></td>
    <td><label><input type="checkbox">C</label></td>
    <td><label><input type="checkbox">D</label></td>
  </tr>
</table>
  </form>
  <div></div>
<script>

    function Achecked()
    {
    	if($("#A:checked").val())
    	 	$("div").text('A is checked');
    	else $("div").text('A is not checked');
    }
   
    $(":checkbox").click(Achecked);

</script>

</body>
</html>

There it only checks if A is checked. I added an id to the checkbox A.

Member Avatar for essential

you may try this -->

<!DOCTYPE html>
<html>
<head>
  <style>
  div { color:red; }
  </style>
  <script type="application/javascript">
	onload = ( function() {

		var elem = document.getElementsByTagName('*');
		var ids = [ 'A', 'B', 'C', 'D' ];
		var cLen = ids.length;

			for ( var x = 0; x < cLen; ++x ) {
				elem[ ids[ x ]].onclick = ( function() {
				var chrLen = elem['show'].textContent.length;
				
					if ( this.checked ) {
						if ( chrLen >=1 ) 
							elem['show'].appendChild( document.createTextNode( " & " + this.id  ));
						else
							elem['show'].appendChild( document.createTextNode( this.id ));
						
						
					        
						

					}
								

					else {
						if ( chrLen !== 1 )
							elem['show'].innerHTML = elem['show'].textContent.replace( " & " + this.id, "" );
						else
							
						elem['show'].innerHTML = "";
					}

				} );
			}
		
		} );



  </script>
</head>
<body>
  <form>
    


<table >
  <tr>
    <td><label><input id="A" type="checkbox">A</label></td>
    <td><label><input id="B" type="checkbox">B</label></td>
    <td><label><input id="C" type="checkbox">C</label></td>
    <td><label><input id="D" type="checkbox">D</label></td>
  </tr>
</table>
  </form>
  <div id="show"></div>
<script>

   /* function Achecked()
    {
    	if($("#A:checked").val())
    	 	$("div").text('A is checked');
    	else $("div").text('A is not checked');
    }
   
    $(":checkbox").click(Achecked); */

</script>

</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.