Forums / Developer / JavaScript check all check box in form

JavaScript check all check box in form

Author Message

piyawat mahawan

Monday 07 July 2008 2:59:45 am

JavaScript check all check box in form

Do you have a problem to check all check box is very more? This script I think it is ok .what do you think.?
Hear the JavaScript code

Example

<script language="javascript">
function check_all(){
NumChkBox=document.form_check.checkbox.length;

if(document.getElementById('check_all_box').checked==true){
for(i=1;i<=NumChkBox;i++){
NameChekBox="checkbox"+i;
document.getElementById("checkbox"+i).checked=true;
}

}else if(document.getElementById('check_all_box').checked==false){
for(i=1;i<=NumChkBox;i++){
NameChekBox="checkbox"+i;
document.getElementById("checkbox"+i).checked=false;
}

}
}
</script>

Hear the HTML code

Example

<body>
<form id="form1" name="form_check" method="post" action="">
<input type="checkbox" name="checkbox" id="checkbox1" value="checkbox" /> check box1<br>
<input type="checkbox" name="checkbox" id="checkbox2" value="checkbox" /> check box2<br>
<input type="checkbox" name="checkbox" id="checkbox3" value="checkbox" /> check box3<br>
<input type="checkbox" name="checkbox" id="checkbox4" value="checkbox" /> check box4<br>
<input type="checkbox" name="checkbox" id="checkbox5" value="checkbox" /> check box5<br>
<input type="checkbox" name="checkbox" id="checkbox6" value="checkbox" /> check box6<br>
<input type="checkbox" name="checkbox" id="checkbox7" value="checkbox" /> check box7
</form>
<input type="checkbox" name="check_all_box" id="check_all_box" onclick="check_all()" value="checkbox" />
<b>check all box</b>
</body>

Michael Scofield

Monday 07 July 2008 11:09:58 pm

Try this one:


<script>

function check_all() {
   // gets Instance to the Form
   this.form = document.getElementById('form1');
   
   // verifies if the instance was successfully obtained
   if (this.form) {
   
      // gets the current check state
      this.newCheckedValue = document.getElementById('check_all_box').checked;
	  

      // gets instace array for all input elements of the form
      this.checkboxNodes = this.form.getElementsByTagName('input');
	  
	  // loops the array
      for (this.i = 0; this.i < this.checkboxNodes.length; this.i++) {

          // verifies if the input element is a checkbox
          if (this.checkboxNodes[i].getAttribute('type') == 'checkbox') {
	   
	         // sets the new check value
             this.checkboxNodes[i].checked = this.newCheckedValue;
		  
		  }
		  
      }
	  
   }
}

</script>


<form id="form1" name="form_check" method="post" action="">
<input type="checkbox" name="checkbox" id="checkbox1" value="checkbox" /> check box1<br>
<input type="checkbox" name="checkbox" id="checkbox2" value="checkbox" /> check box2<br>
<input type="checkbox" name="checkbox" id="checkbox3" value="checkbox" /> check box3<br>
<input type="checkbox" name="checkbox" id="checkbox4" value="checkbox" /> check box4<br>
<input type="checkbox" name="checkbox" id="checkbox5" value="checkbox" /> check box5<br>
<input type="checkbox" name="checkbox" id="checkbox6" value="checkbox" /> check box6<br>
<input type="checkbox" name="checkbox" id="checkbox7" value="checkbox" /> check box7
</form>
<input type="checkbox" name="check_all_box" id="check_all_box" onclick="check_all()" value="checkbox" /> 

Btw, I think you are posting in the wrong forum, this is Ez Publish forum!! ;-)

Michael Scofield

piyawat mahawan

Tuesday 08 July 2008 8:30:56 pm

sorry i want some body to guide .

Piotrek Karaƛ

Tuesday 08 July 2008 9:51:28 pm

Hi,

This seems to be strictly JavaScript-related problem. Even though eZ Publish uses a number of technologies and standards, you're highly unlikely to learn those here, you should be much better of seearching some JavaScript-dedicated communities or docs.

Cheers,
Piotrek

EDIT: Sorry, haven't noticed Michael's remark.

--
Company: mediaSELF Sp. z o.o., http://www.mediaself.pl
eZ references: http://ez.no/partners/worldwide_partners/mediaself
eZ certified developer: http://ez.no/certification/verify/272585
eZ blog: http://ez.ryba.eu

Bruce Morrison

Tuesday 08 July 2008 11:27:36 pm

Howdy

There is actually a javascript function included in eZ publish (at least the admin interface) that does this.

Check out design/standard/javascript/tools/ezjsselection.js

ezjs_toggleCheckboxes( document.children, 'DeleteIDArray[]' )

The first parameter is the form DOm object, the second the checkboxname.

cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

Pascal Specht

Wednesday 09 July 2008 7:59:35 am

Slightly off-topic, but very handy when it comes to check a lot of checkboxes in the backend (for example when deleting content): the CheckFox extention for Firefox: it allows to quickly check all checkboxes within the selected area...

</Pascal>

piyawat mahawan

Wednesday 09 July 2008 8:38:02 pm

thank you for us some kindly.