Create array from checkbox id's

[hubbs-2]

I am trying to create an array using the .map() method made up of the
ids of checked checkbox's.  I am then wanting to use alert, to alert
each id to the user one at a time.

    $("#testLink").click(function() {
        var array = $.map($("#text
input[@type='checkbox']:checked").attr("id"),
        function() {
            return this.id;
        });
        alert(array);
    });


<input type="checkbox" class="itemCheckDelete" name="test1"
id="test1" />
<input type="checkbox" class="itemCheckDelete" name="test2"
id="test2" />
<input name="test3" type="checkbox" class="itemCheckDelete" id="test3"
checked="checked" />

 <a href="#" id="testLink">Click</a>

[Michael Geary-3]

And your question is...?

> I am trying to create an array using the .map() method made
> up of the ids of checked checkbox's.  I am then wanting to
> use alert, to alert each id to the user one at a time.
>
>     $("#testLink").click(function() {
>         var array = $.map($("#text
> input[@type='checkbox']:checked").attr("id"),
>         function() {
>             return this.id;
>         });
>         alert(array);
>     });
>
>
> <input type="checkbox" class="itemCheckDelete" name="test1"
> id="test1" />
> <input type="checkbox" class="itemCheckDelete" name="test2"
> id="test2" />
> <input name="test3" type="checkbox" class="itemCheckDelete" id="test3"
> checked="checked" />
>
>  <a href="#" id="testLink">Click</a>

[Ariel Flesler]

I think the problem is pretty clear. You added '.attr("id")'.
You're not mapping the checkboxes, but the first id.

$("#testLink").click(function() {
   var array = $("#text input:checkbox:checked").map(function() {
       if( this.id )
           return this.id;
   });
   alert(array);
});

I added the 'if' so that if a checkbox doesn't have id, it will be
skipped, you can take that out if it's not the case.

Cheers

--
Ariel Flesler
http://flesler.blogspot.com/

On 23 jul, 19:35, hubbs <nnhubb...@...> wrote:

> I am trying to create an array using the .map() method made up of the
> ids of checked checkbox's.  I am then wanting to use alert, to alert
> each id to the user one at a time.
>
>     $("#testLink").click(function() {
>         var array = $.map($("#text
> input[@type='checkbox']:checked").attr("id"),
>         function() {
>             return this.id;
>         });
>         alert(array);
>     });
>
> <input type="checkbox" class="itemCheckDelete" name="test1"
> id="test1" />
> <input type="checkbox" class="itemCheckDelete" name="test2"
> id="test2" />
> <input name="test3" type="checkbox" class="itemCheckDelete" id="test3"
> checked="checked" />
>
>  <a href="#" id="testLink">Click</a>

[hubbs-2]

Ariel,

I tried this but the alert just says object Object, I was expecting it
to alert me of each checkbox that was clicked, and show me the ID.
Did I do something wrong?

On Jul 23, 6:58 pm, Ariel Flesler <afles...@...> wrote:

> I think the problem is pretty clear. You added '.attr("id")'.
> You're not mapping the checkboxes, but the first id.
>
> $("#testLink").click(function() {
>    var array = $("#text input:checkbox:checked").map(function() {
>        if( this.id )
>            return this.id;
>    });
>    alert(array);
>
> });
>
> I added the 'if' so that if a checkbox doesn't have id, it will be
> skipped, you can take that out if it's not the case.
>
> Cheers
>
> --
> Ariel Fleslerhttp://flesler.blogspot.com/
>
> On 23 jul, 19:35, hubbs <nnhubb...@...> wrote:
>
> > I am trying to create an array using the .map() method made up of the
> > ids of checked checkbox's.  I am then wanting to use alert, to alert
> > each id to the user one at a time.
>
> >     $("#testLink").click(function() {
> >         var array = $.map($("#text
> > input[@type='checkbox']:checked").attr("id"),
> >         function() {
> >             return this.id;
> >         });
> >         alert(array);
> >     });
>
> > <input type="checkbox" class="itemCheckDelete" name="test1"
> > id="test1" />
> > <input type="checkbox" class="itemCheckDelete" name="test2"
> > id="test2" />
> > <input name="test3" type="checkbox" class="itemCheckDelete" id="test3"
> > checked="checked" />
>
> >  <a href="#" id="testLink">Click</a>

[Ca-Phun Ung]

hubbs wrote:
> Ariel,
>
> I tried this but the alert just says object Object, I was expecting it
> to alert me of each checkbox that was clicked, and show me the ID.
> Did I do something wrong?
>
>  

No. You're right. Ariel's solution is correct aswell. To get an alert
box with the actual id's listed try this:

alert(array.get());

Also to make Ariel's solution a little more elegant try this:

$("#testLink").click(function() {
    var array = $("#text input:checkbox[@id!='']:checked").map(function() {
        return this.id;
    });
    alert(array.get());
    return false;
});

All I did was move the ID check into the element selector clause.

Ca Phun Ung

Web: http://yelotofu.com

[hubbs-2]

Still trying to get this to work, but it does not seem to.  Will this
work getting the id attribute?  This was my goal.

On Jul 23, 10:53 pm, Ca Phun Ung <cap...@...> wrote:

> hubbs wrote:
> > Ariel,
>
> > I tried this but the alert just says object Object, I was expecting it
> > to alert me of each checkbox that was clicked, and show me the ID.
> > Did I do something wrong?
>
> No. You're right. Ariel's solution is correct aswell. To get an alert
> box with the actual id's listed try this:
>
> alert(array.get());
>
> Also to make Ariel's solution a little more elegant try this:
>
> $("#testLink").click(function() {
>     var array = $("#text input:checkbox[@id!='']:checked").map(function() {
>         return this.id;
>     });
>     alert(array.get());
>     return false;
>
> });
>
> All I did was move the ID check into the element selector clause.
>
> Ca Phun Ung
>
> Web:http://yelotofu.com

[Ariel Flesler]

The array does have the ids, but an alert doesn't show the inner
content of arrays.

Ca Phun Ung's solution seems 100% correct.

--
Ariel Flesler
http://flesler.blogspot.com/

On 25 jul, 14:57, hubbs <nnhubb...@...> wrote:

> Still trying to get this to work, but it does not seem to.  Will this
> work getting the id attribute?  This was my goal.
>
> On Jul 23, 10:53 pm, Ca Phun Ung <cap...@...> wrote:
>
>
>
> > hubbs wrote:
> > > Ariel,
>
> > > I tried this but the alert just says object Object, I was expecting it
> > > to alert me of each checkbox that was clicked, and show me the ID.
> > > Did I do something wrong?
>
> > No. You're right. Ariel's solution is correct aswell. To get an alert
> > box with the actual id's listed try this:
>
> > alert(array.get());
>
> > Also to make Ariel's solution a little more elegant try this:
>
> > $("#testLink").click(function() {
> >     var array = $("#text input:checkbox[@id!='']:checked").map(function() {
> >         return this.id;
> >     });
> >     alert(array.get());
> >     return false;
>
> > });
>
> > All I did was move the ID check into the element selector clause.
>
> > Ca Phun Ung
>
> > Web:http://yelotofu.com- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

[hubbs-2]

How could I then print out he array of id's?

I tried $("#test").append(array.get()); but that didn't print them, I
must be missing something....

On Jul 25, 11:11 am, Ariel Flesler <afles...@...> wrote:

> The array does have the ids, but an alert doesn't show the inner
> content of arrays.
>
> Ca Phun Ung's solution seems 100% correct.
>
> --
> Ariel Fleslerhttp://flesler.blogspot.com/
>
> On 25 jul, 14:57, hubbs <nnhubb...@...> wrote:
>
> > Still trying to get this to work, but it does not seem to.  Will this
> > work getting the id attribute?  This was my goal.
>
> > On Jul 23, 10:53 pm, Ca Phun Ung <cap...@...> wrote:
>
> > > hubbs wrote:
> > > > Ariel,
>
> > > > I tried this but the alert just says object Object, I was expecting it
> > > > to alert me of each checkbox that was clicked, and show me the ID.
> > > > Did I do something wrong?
>
> > > No. You're right. Ariel's solution is correct aswell. To get an alert
> > > box with the actual id's listed try this:
>
> > > alert(array.get());
>
> > > Also to make Ariel's solution a little more elegant try this:
>
> > > $("#testLink").click(function() {
> > >     var array = $("#text input:checkbox[@id!='']:checked").map(function() {
> > >         return this.id;
> > >     });
> > >     alert(array.get());
> > >     return false;
>
> > > });
>
> > > All I did was move the ID check into the element selector clause.
>
> > > Ca Phun Ung
>
> > > Web:http://yelotofu.com-Ocultar texto de la cita -
>
> > - Mostrar texto de la cita -

[Ariel Flesler]

Ca Phun Ung's code works. The alert shows the ids, if any.

--
Ariel Flesler
http://flesler.blogspot.com/

On 25 jul, 15:39, hubbs <nnhubb...@...> wrote:

> How could I then print out he array of id's?
>
> I tried $("#test").append(array.get()); but that didn't print them, I
> must be missing something....
>
> On Jul 25, 11:11 am, Ariel Flesler <afles...@...> wrote:
>
>
>
> > The array does have the ids, but an alert doesn't show the inner
> > content of arrays.
>
> > Ca Phun Ung's solution seems 100% correct.
>
> > --
> > Ariel Fleslerhttp://flesler.blogspot.com/
>
> > On 25 jul, 14:57, hubbs <nnhubb...@...> wrote:
>
> > > Still trying to get this to work, but it does not seem to.  Will this
> > > work getting the id attribute?  This was my goal.
>
> > > On Jul 23, 10:53 pm, Ca Phun Ung <cap...@...> wrote:
>
> > > > hubbs wrote:
> > > > > Ariel,
>
> > > > > I tried this but the alert just says object Object, I was expecting it
> > > > > to alert me of each checkbox that was clicked, and show me the ID.
> > > > > Did I do something wrong?
>
> > > > No. You're right. Ariel's solution is correct aswell. To get an alert
> > > > box with the actual id's listed try this:
>
> > > > alert(array.get());
>
> > > > Also to make Ariel's solution a little more elegant try this:
>
> > > > $("#testLink").click(function() {
> > > >     var array = $("#text input:checkbox[@id!='']:checked").map(function() {
> > > >         return this.id;
> > > >     });
> > > >     alert(array.get());
> > > >     return false;
>
> > > > });
>
> > > > All I did was move the ID check into the element selector clause.
>
> > > > Ca Phun Ung
>
> > > > Web:http://yelotofu.com-Ocultartexto de la cita -
>
> > > - Mostrar texto de la cita -- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

[hubbs-2]

Ok, I rewrote it and got it to work:

$("#testlink").click(function() {
        var checked = $("input:checked").map(function() {
            return $(this).attr("id");
        }).get().join(", ");
        $("p").html(checked);
    });

Now when I click on my testlink it will put all of the checked input
id's into the p tag.  Hooray!

Now, as a last step, how could I hide each id that is within the
array?  I tried $(checked).hide(); but that did not work.

Thanks for all the help.

On Jul 25, 12:00 pm, Ariel Flesler <afles...@...> wrote:

> Ca Phun Ung's code works. The alert shows the ids, if any.
>
> --
> Ariel Fleslerhttp://flesler.blogspot.com/
>
> On 25 jul, 15:39, hubbs <nnhubb...@...> wrote:
>
> > How could I then print out he array of id's?
>
> > I tried $("#test").append(array.get()); but that didn't print them, I
> > must be missing something....
>
> > On Jul 25, 11:11 am, Ariel Flesler <afles...@...> wrote:
>
> > > The array does have the ids, but an alert doesn't show the inner
> > > content of arrays.
>
> > > Ca Phun Ung's solution seems 100% correct.
>
> > > --
> > > Ariel Fleslerhttp://flesler.blogspot.com/
>
> > > On 25 jul, 14:57, hubbs <nnhubb...@...> wrote:
>
> > > > Still trying to get this to work, but it does not seem to.  Will this
> > > > work getting the id attribute?  This was my goal.
>
> > > > On Jul 23, 10:53 pm, Ca Phun Ung <cap...@...> wrote:
>
> > > > > hubbs wrote:
> > > > > > Ariel,
>
> > > > > > I tried this but the alert just says object Object, I was expecting it
> > > > > > to alert me of each checkbox that was clicked, and show me the ID.
> > > > > > Did I do something wrong?
>
> > > > > No. You're right. Ariel's solution is correct aswell. To get an alert
> > > > > box with the actual id's listed try this:
>
> > > > > alert(array.get());
>
> > > > > Also to make Ariel's solution a little more elegant try this:
>
> > > > > $("#testLink").click(function() {
> > > > >     var array = $("#text input:checkbox[@id!='']:checked").map(function() {
> > > > >         return this.id;
> > > > >     });
> > > > >     alert(array.get());
> > > > >     return false;
>
> > > > > });
>
> > > > > All I did was move the ID check into the element selector clause.
>
> > > > > Ca Phun Ung
>
> > > > > Web:http://yelotofu.com-Ocultartextode la cita -
>
> > > > - Mostrar texto de la cita -- Ocultar texto de la cita -
>
> > - Mostrar texto de la cita -

[Ca-Phun Ung]

hubbs wrote:
> Now, as a last step, how could I hide each id that is within the
> array?  I tried $(checked).hide(); but that did not work.
>  

Try this:

$("#testlink").click(function() {
    var checked = $("input:checked").hide().map(function() {
        return $(this).attr("id");
    }).get().join(", ");
    $("p").html(checked);
});

Now, just to prove the previous solution(s) were totally correct, this
also works:

$("#testlink").click(function(e) {
    var array = $("input:checkbox[@id!='']:checked").hide().map(function() {
        return this.id;
    });
    $("p").html(array.get().join(", "));
    return false;
});

Ca Phun Ung
Web: http://yelotofu.com

[hubbs-2]

Got it.  Thanks for all the help!

On Jul 25, 9:07 pm, Ca Phun Ung <cap...@...> wrote:

> hubbs wrote:
> > Now, as a last step, how could I hide each id that is within the
> > array?  I tried $(checked).hide(); but that did not work.
>
> Try this:
>
> $("#testlink").click(function() {
>     var checked = $("input:checked").hide().map(function() {
>         return $(this).attr("id");
>     }).get().join(", ");
>     $("p").html(checked);
>
> });
>
> Now, just to prove the previous solution(s) were totally correct, this
> also works:
>
> $("#testlink").click(function(e) {
>     var array = $("input:checkbox[@id!='']:checked").hide().map(function() {
>         return this.id;
>     });
>     $("p").html(array.get().join(", "));
>     return false;
>
> });
>
> Ca Phun Ung
> Web:http://yelotofu.com