Logic in JQuery, updating with checkboxes

Question

All of my code is working properly, I'm just trying to expand it to work for all possibilities, know there must be a better way to do it, but don't think I know javascript well enough (I just started learning).

Essentially, I'm trying to call data from a database based on which checkboxes on my web app are checked. There are four boxes: "committees", "candidates", "individuals", "opinion".

My code is this:

if($('#committees').attr('checked')) {
    $.get("file.pl",
    {
       act: "near",
       format: "raw"
       what: "committees"
    }, NewData);
}
else {
    $.get("file.pl",
    {
       act: "near",
       format: "raw"
       what: ""
    }, NewData);

which works perfectly for just the committees checkbox, (the ids of the other boxes match the table name for the "what", and match the above-stated names. I want to have this work for all 4 checked boxes, without having to make huge nested statements for every possible combination of checked boxes.

I know I can list more options in the "what" category like this:

$.get("file.pl",
        {
           act: "near",
           format: "raw"
           what: "committees, candidates, individuals, opinions"
        }, NewData);

and that works, but Idk how to dynamically change that string to match which boxes are checked. Thanks for any help you can offer!

PeterKA · Accepted Answer · 2014-10-14 02:07:26Z

1

Even though you said that your code works, I would advise that you use .is(':checked') instead of .attr('checked'):

Then you would have to assign each checkbox a class that they all would share, say .checkbox. And your code would be:

$('.checkbox').each(function() {
    if($(this).is(':checked')) {
        $.get("file.pl",
              {
                  act: "near",
                  format: "raw"
                  what: this.id
              }, NewData);
    } else {
        $.get("file.pl",
              {
                  act: "near",
                  format: "raw"
                  what: ""
              }, NewData);
    }    
});

UPDATE

I now realize that a construct like this does need a closure in order for it to work:

$('.checkbox').each(function() {
    (function( that ) {
        if($(that).is(':checked')) {
            $.get("file.pl",
              {
                  act: "near",
                  format: "raw"
                  what: that.id
              }, NewData);
        } else {
            $.get("file.pl",
              {
                  act: "near",
                  format: "raw"
                  what: ""
              }, NewData);
        }
    })( this );   
});

edited Oct 14, 2014 at 2:07

answered Oct 12, 2014 at 19:13

PeterKA

24.7k5 gold badges28 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

singmotor Over a year ago

This didn't work because only the last selection of data goes through, I figured it out though, posted my answer below. Thanks for responding.

PeterKA Over a year ago

I figured as much. Glad you figure it out. The updated version may be helpful if you'd like to process all the checkoxes at once.

cforcloud · Accepted Answer · 2014-10-12 19:15:09Z

0

Do you mean something like this. Use 'this' keyword.
HTML

<input type="checkbox" class="file-pl" id="committees" />
<input type="checkbox" class="file-pl" id="candidates" />
<input type="checkbox" class="file-pl" id="individuals" />
<input type="checkbox" class="file-pl" id="opinions" />

JS

$(".file-pl").click(function(){
    var what = this.checked ? this.id : "";

    $.get("file.pl", {
    act: "near",
    format: "raw"
    what: what
    }, NewData);
});

answered Oct 12, 2014 at 19:15

cforcloud

5892 silver badges8 bronze badges

Comments

singmotor · Accepted Answer · 2014-10-14 00:23:39Z

0

The above answers didn't quite work unfortunately. What ended up working was this:

var what string = "";
$('.filters').each(function() {
   if($(this).is(':checked')) {
      what string = whatstring+this.id+", ";
     }});
$.get("file.pl",
    {
       act: "near",
       format: "raw"
       what: whatstring
    }, NewData);

answered Oct 14, 2014 at 0:23

singmotor

4,19013 gold badges55 silver badges82 bronze badges

Collectives™ on Stack Overflow

Logic in JQuery, updating with checkboxes

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related