thr3ads.net - Rails spinoffs - getting all selected checkboxes [Apr 2007]

If this information is useful, please help other people find it:
Share via:

Jason

2007-Apr-24 09:16 UTC

getting all selected checkboxes

Hi everyone.

I''m kind of stuck with a problem an I hope you can give me a hint on
how to solve it.

I have a page with several (varying amount) checkboxes on it (called
memberemail). I have a script looping over all checkboxes, adding the
value (if selected) to a link.

--
    link=''mailto:'';
    sel=0;
    for( i=0; i<document.form.memberemail.length; i++){
        if(document.form.memberemail[i].checked){
            link=link+document.form.memberemail[i].value+'';'';
            sel++;
        }
    }
--

Since I''m using prototype in some other pages, I wanted to migrate
this too. I tried the following which is working with <select> tags
and other <input> tags.

--
    link=''mailto:'';
    sel=0;
    for( i=0; i<$(''memberemail'').length; i++){
        if($(''memberemail'')[i].checked){
           
link=link+$(''memberemail'')[i].value+'';'';
            sel++;
        }
    }
--

After trying some other variants I derived from documentation or other
examples, but I can''t get it working. Furthermore performance is an
issue here, because there are up to 2k checkboxes in the page.

Hoping you will have a solution for me ;-)

I send greetings from Munich.

Jens


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

RobG

2007-Apr-24 10:49 UTC

head link

Re: getting all selected checkboxes

On Apr 24, 7:16 pm, Jason <m...-2dHFW0EhLNk@public.gmane.org>
wrote:> Hi everyone.
>
> I''m kind of stuck with a problem an I hope you can give me a hint
on
> how to solve it.
>
> I have a page with several (varying amount) checkboxes on it (called
> memberemail). I have a script looping over all checkboxes, adding the
> value (if selected) to a link.
>
> --
>     link=''mailto:'';
>     sel=0;
>     for( i=0; i<document.form.memberemail.length; i++){
>         if(document.form.memberemail[i].checked){
>            
link=link+document.form.memberemail[i].value+'';'';
>             sel++;
>         }
>     }
> --
>
> Since I''m using prototype in some other pages, I wanted to migrate
> this too. I tried the following which is working with <select> tags
> and other <input> tags.
>
> --
>     link=''mailto:'';
>     sel=0;
>     for( i=0; i<$(''memberemail'').length; i++){
>         if($(''memberemail'')[i].checked){
>            
link=link+$(''memberemail'')[i].value+'';'';
>             sel++;
>         }
>     }
> --
If you want to use Prototype.js to do this, you need to convert the
collection to an array, then use the each method.  But as I show
below, there''s no point in using that just to be cool and use
Array.each, it''s faster to write your own function to iterate over the
collection rather than convert it to an array then iterate over it.

> After trying some other variants I derived from documentation or other
> examples, but I can''t get it working. Furthermore performance is
an
> issue here, because there are up to 2k checkboxes in the page.
Putting 2,000 elements in a page is absurd, but if that''s what you
want to do, write your own function to loop over the them, it''s much
faster than using Prototype.js''s each() (Safari was 3x, Firefox 2x)
and doesn''t take any more code.  Here''s a simple example:

<script type="text/javascript">

 function getCheckedP(f){
   var el, els = $A(f.getElementsByTagName(''input''));
   var result = [];
   els.each(function(el){
     if (el.checked) result.push(el.value);
   });
   return result.join('';'');
 }

 function showCheckedP(f){
   var sTime = new Date();
   var s = getCheckedP(f);
   var ms = new Date() - sTime;
   $(''xx'').innerHTML = ms + ''ms<br>'' +
s;
 }

 function getChecked(f) {
   var el, els = f.getElementsByTagName(''input'');
   var result = [];
   for (var i=0, len=els.length; i<len; i++){
     el = els[i];
     if (el.checked) result.push(el.value);
   }
   return result.join('';'');
 }

 function showChecked(f){
   var sTime = new Date();
   var s = getChecked(f);
   var ms = new Date() - sTime;
   $(''xx'').innerHTML = ms + ''ms<br>'' +
s;
 }

 </script>

<div id="xx"></div>
<form action="">
  <input type="button" value="Show checked plain"
   onclick="showChecked(this.form);"><br>
  <input type="button" value="Show checked Prototype.js"
   onclick="showCheckedP(this.form);"><br>
  <script type="text/javascript">
    var x = [],
        i = 2000;
    while (i--){
      x.push(''<input type="checkbox"
value="''+i+''">'');
      if (!(i%100)) x.push(''<br>'');
    }
    document.write(x.join(''''));
  </script>
</form>


Before people say "but you should be using Form.getElements()", try
it, it''s 3x slower than using $A(...).  In Safari[1] that''s
9ms (plain
js) versus 160ms (Prototype.js and Form.getElements) - the first
Prototype run takes 1.5 seconds.  In Opera the plain js was 10x faster
(6ms versus 61ms), again the first run took about 1.4 seconds.

Others are welcome to suggest faster ways.  If order is unimportant, a
while loop might be faster in some browsers, a do loop might be faster
still and maintain order - test thoroughly.


1. Using a 2.0 GHz MacBook Core2Duo.


--
Rob


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Jason

2007-Apr-24 11:04 UTC

head link

Re: getting all selected checkboxes

> If you want to use Prototype.js to do this, you need to convert the
> collection to an array, then use the each method.  But as I show
> below, there''s no point in using that just to be cool and use
> Array.each, it''s faster to write your own function to iterate over
the
> collection rather than convert it to an array then iterate over it.
Thanks Rob for sharing my opinion ;-) Theses results I found yesterday
(i.e. $$(''memberemail'')) and thought "This is
impossible"... Just
wanted to see if there are any other possibilities in the lib I didn''t
know.
> Putting 2,000 elements in a page is absurd, but if that''s what you
> want to do, write your own function to loop over the them, it''s
much
> faster than using Prototype.js''s each() (Safari was 3x, Firefox
2x)
> and doesn''t take any more code.  Here''s a simple example:
You''re absolute right, but tell this your customer if absolutely
insists on having a page with all of his users from a database and an
checkbox for mailing (or not) each of them ;-)

Again thanks for your effort.
Jens


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Michael Peters

2007-Apr-24 13:53 UTC

head link

Re: getting all selected checkboxes

RobG wrote:> On Apr 24, 7:16 pm, Jason <m...-2dHFW0EhLNk@public.gmane.org> wrote:
>> Hi everyone.
>>
>> I''m kind of stuck with a problem an I hope you can give me a
hint on
>> how to solve it.
>>
>> I have a page with several (varying amount) checkboxes on it (called
>> memberemail). I have a script looping over all checkboxes, adding the
>> value (if selected) to a link.
[snip]
> Before people say "but you should be using Form.getElements()",
try
> it, it''s 3x slower than using $A(...).  In Safari[1]
that''s 9ms (plain
> js) versus 160ms (Prototype.js and Form.getElements) - the first
> Prototype run takes 1.5 seconds.  In Opera the plain js was 10x faster
> (6ms versus 61ms), again the first run took about 1.4 seconds.
> 
> Others are welcome to suggest faster ways.  If order is unimportant, a
> while loop might be faster in some browsers, a do loop might be faster
> still and maintain order - test thoroughly.
I''d be interested in seeing how using getElementsBySelector() performs
(since on
some platforms it''ll be using XPath which should be pretty fast). Also,
someone
more CSS will probably correct my selector syntax.

    link=''mailto:'';
    var selector = ''input[type="checkbox"
checked="true"]'';
   
$A($(''memberemail'').getElementsBySelector(selector).each(function
(el) {
       link += el.value + '';'';
    }

-- 
Michael Peters
Developer
Plus Three, LP


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Rails spinoffs - Apr 2007 - getting all selected checkboxes

getting all selected checkboxes

Re: getting all selected checkboxes

Re: getting all selected checkboxes

Re: getting all selected checkboxes