NYCPHP Meetup

NYPHP.org

[nycphp-talk] Javascript "select all" feature?

Phillip Powell phillip.powell at adnet-sys.com
Tue Apr 13 17:18:33 EDT 2004


Your code implementations work!  In Mozilla only.. :(  Fails in IE, 
Opera and Konqueror.. :(

Apparently IE, Opera and Konqueror look for a form element name to be 
alphanumeric construct only (e.g. "move", "move0", "move_move", 
"move-move"), but not "move[]", whereas Mozilla (and I believe Netscape 
but can't test that to know) are more forgiving of "move[]"..

I've tried numerous script examples and they all work in Mozilla and 
fail in IE the moment I use "move[]" instead of "move".

Phil



<script>
<!--
  function selectAll(formElementName) {
   if (document.imageForm.select_all.checked) {
    for (i = 0; i < document.imageForm.length; i++) {
     if (document.imageForm.elements[i].type == 'checkbox' && document.imageForm.elements[i].name == formElementName) {
      document.imageForm.elements[i].checked = true;
     }
    }
    document.imageForm.deselect_all.checked = false;
  }
 }

 function deSelectAll(formElementName) {
  if (!document.imageForm.select_all.checked || document.imageForm.deselect_all.checked) {
   for (i = 0; i < document.imageForm.length; i++) {
    if (document.imageForm.elements[i].type == 'checkbox' && document.imageForm.elements[i].name == formElementName) {
     document.imageForm.elements[i].checked = false;
    }
   }
   document.imageForm.select_all.checked = false;
  }
 }
//-->
</script>



Wellington Fan wrote:

>Try this:
>
>
><script>
><!--
>	function selectAll(f,n,v) {
>		var chk   = ( v == null ? true : v );
>		for (i = 0; i < f.elements.length; i++) {
>			if( f.elements[i].type == 'checkbox' &&
>f.elements[i].name == n ) {
>				f.elements[i].checked = chk;
>			}
>		}
>	}
>//-->
></script>
>
><form>
><input type="text" name="move[]"><br>
><input type="checkbox" name="move[]"><br>
><input type="checkbox" name="move[]"><br>
><input type="checkbox" name="move[]"><br>
><input type="checkbox" name="move[]"><br>
><input type="radio" name="move[]"><br>
><input type="checkbox" name="select[]"><br>
><input type="checkbox" name="select[]"><br>
><input type="checkbox" name="select[]"><br>
><input type="checkbox" name="select[]"><br>
><input type="button" onClick="selectAll(this.form,'move[]')" name="butt"
>value="check em">
><input type="button" onClick="selectAll(this.form,'move[]',false)"
>name="butt" value="clear em">
></form>
>
>
>So  selectAll(this.form,'move[]',false)   can take 2 or 3 args:
>
>1. - reference to the form
>2. - the 'name' of the checkboxes to be set/cleared
>3. - <optional, default is true> false to clear the checkboxes
>
>--
>Wellington
>
>
>
>
>
>
>
>
>  
>
>>-----Original Message-----
>>From: talk-bounces at lists.nyphp.org 
>>[mailto:talk-bounces at lists.nyphp.org] On Behalf Of Phillip Powell
>>Sent: Tuesday, April 13, 2004 4:04 PM
>>To: NYPHP Talk
>>Subject: Re: [nycphp-talk] Javascript "select all" feature?
>>
>>
>>What about the other checkboxes, "select_all" and 
>>"deselect_all", along 
>>with other dynamically-generated checkbox groups that may also exist 
>>within this HTML resultset?
>>
>>Phil
>>
>>felix zaslavskiy wrote:
>>
>>    
>>
>>>Try this:
>>>for (var i = 0; i < document.imageForm.elements.length; i++){ 
>>>if(document.imageForm.elements[i].type == 'checkbox'){
>>>     document.imageForm.elements[i].checked = true;
>>>}
>>>}
>>> 
>>>
>>>      
>>>
>>>>I am producing a form using PHP on the back end and 
>>>>        
>>>>
>>Javascript on the 
>>    
>>
>>>>front end.  The resulting script will come to the browser 
>>>>        
>>>>
>>as follows:
>>    
>>
>>>>[Code]
>>>><script>
>>>><!--
>>>> function selectAll() {
>>>>  moveElement = eval("document.imageForm.move" + "[]");
>>>>  alert(moveElement);
>>>>  if (document.imageForm.select_all[0].checked) {
>>>>   for (i = 0; i < document.imageForm.move.length; i++) {
>>>>    document.imageForm.move[i].checked = true;
>>>>   }
>>>> }
>>>>}
>>>>
>>>>function deSelectAll() {
>>>> if (!document.imageForm.select_all[0].checked ||
>>>>document.imageForm.deselect_all[0].checked) {
>>>>  for (i = 0; i < document.imageForm.move.length; i++) {
>>>>   document.imageForm.move[i].checked = false;
>>>>  }
>>>> }
>>>>}
>>>>//-->
>>>></script>
>>>>[/Code]
>>>>
>>>>This will work with a checkbox group that has to have this naming 
>>>>convention for PHP:
>>>>
>>>>[Code]
>>>><input type=checkbox name=move[] value="myImage.gif"> - 
>>>>        
>>>>
>>Move? [/Code]
>>    
>>
>>>>I will also have a checkbox that will "select all" and "de-select 
>>>>all":
>>>>
>>>>[Code]
>>>><input type=checkbox name=select_all value=1 
>>>>        
>>>>
>>onChange="selectAll()"> - 
>>    
>>
>>>>Select All <input type=checkbox name=deselect_all value=1 
>>>>onChange="deSelectAll()">
>>>>- De-select All
>>>>[/Code]
>>>>
>>>>I am not familiar at how Javascript can work with 
>>>>        
>>>>
>>non-standard naming 
>>    
>>
>>>>conventions for event actions, can someone tell me what I'm doing 
>>>>wrong?  This fails at least in Mozilla 1.6
>>>>
>>>>Thanx
>>>>Phil
>>>>
>>>>_______________________________________________
>>>>talk mailing list
>>>>talk at lists.nyphp.org http://lists.nyphp.org/mailman/listinfo/talk
>>>>
>>>>   
>>>>
>>>>        
>>>>
>>> 
>>>
>>>      
>>>
>>_______________________________________________
>>talk mailing list
>>talk at lists.nyphp.org http://lists.nyphp.org/mailman/listinfo/talk
>>
>>    
>>
>
>_______________________________________________
>talk mailing list
>talk at lists.nyphp.org
>http://lists.nyphp.org/mailman/listinfo/talk
>
>  
>





More information about the talk mailing list