[nycphp-talk] Javascript "select all" feature?
Chris Bielanski
Cbielanski at inta.org
Tue Apr 13 17:43:14 EDT 2004
Oops, once again I provide an unclear example... what I meant is that move[]
becomes move1, move2, move3,..moveN when you output to the browser, and the
same upon receipt from the client. let me rearrange:
<script>
<!--
function selectAll() {
if (document.imageForm.select_all.checked) {
for (i = 0; i < moveElement.length; i++) {
var moveElement = eval("document.imageForm.move" + i);
moveElement.checked = true;
}
document.imageForm.deselect_all.checked = false;
}
}
</script>
See how that treats you...
~C
> -----Original Message-----
> From: Phillip Powell [mailto:phillip.powell at adnet-sys.com]
> Sent: Tuesday, April 13, 2004 5:39 PM
> To: NYPHP Talk
> Subject: Re: [nycphp-talk] Javascript "select all" feature?
>
>
> 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
> >
> >
> >
>
>
> _______________________________________________
> talk mailing list
> talk at lists.nyphp.org
> http://lists.nyphp.org/mailman/listinfo/talk
>
More information about the talk
mailing list