NYCPHP Meetup

NYPHP.org

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

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


Following are all of the variations I tried using Javascript:
[Quote]
<script>
<!--
  function selectAll() {
   if (document.imageForm.select_all.checked) {
    var moveElement = eval("document.imageForm.move" + i);
    for (i = 0; i < moveElement.length; i++) {
     moveElement[i].checked = true;
    }
   document.imageForm.deselect_all.checked = false;
  }
 }
</script>

<script>
<!--
  function selectAll() {
   if (document.imageForm.select_all.checked) {
    var moveElement = eval("document.imageForm.move\[" + i + "\]");
    for (i = 0; i < moveElement.length; i++) {
     moveElement[i].checked = true;
    }
   document.imageForm.deselect_all.checked = false;
  }
 }
</script>

<script>
<!--
  function selectAll() {
   if (document.imageForm.select_all.checked) {
    var moveElement = eval("document.imageForm.move\[\]");
    for (i = 0; i < moveElement.length; i++) {
     moveElement[i].checked = true;
    }
   document.imageForm.deselect_all.checked = false;
  }
 }
</script>

<script>
<!--
  function selectAll() {
   if (document.imageForm.select_all.checked) {
    var moveElement = eval("document.imageForm.move\[\]");
    alert(moveElement);
    for (i = 0; i < moveElement.length; i++) {
     moveElement[i].checked = true;
    }
   document.imageForm.deselect_all.checked = false;
  }
 }
</script>
[/Quote]

Every single one of these failed.  The alert() didn't even show up.  
Failed in all browsers including Mozilla.

The following *works*.. but only in Mozilla and not in IE, Opera nor 
Konqueror:

[Quote]
<script>
<!--
  function selectAll() {
   if (document.imageForm.select_all.checked) {
    var moveElement = eval("document.imageForm.elements['move[]']");
    alert(moveElement);
    for (i = 0; i < moveElement.length; i++) {
     moveElement[i].checked = true;
    }
   document.imageForm.deselect_all.checked = false;
  }
 }
</script>
[/Quote]

I'm beginning to believe that the PHP array form element construct works 
only in Mozilla because it's non-M$.

Phil

Chris Bielanski wrote:

>If that didn't work, then I think the next step on the road to salvation
>lies in the precipitous use of the eval() function within a for loop:
>for(var i; i < something; i++)
>{
>	var obj = eval('document.forms[0].move'+i);
>	// etc etc...
>}
>
>This is an evil slimy hack but so long as you're in control of the form
>variables, it will take the tedium out of catching each form element.
>
>~C
>  
>
>>-----Original Message-----
>>From: Phillip Powell [mailto:phillip.powell at adnet-sys.com]
>>Sent: Tuesday, April 13, 2004 5:19 PM
>>To: NYPHP Talk
>>Subject: Re: [nycphp-talk] Javascript "select all" feature?
>>
>>
>>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
>>>
>>> 
>>>
>>>      
>>>
>>_______________________________________________
>>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