Question

I have problem with my jQuery code where my Firebug gives me warning: Selector expected.

Here is the code:

$("img[id$='_tick']").each(function() {

    $(this).click(function() {

        var tickIDFinder = $(this).attr("id");
        var tickSection = tickIDFinder.slice(0,1);

        var checkboxID = "\"input[id^='" + tickSection + "_checkbox_']\"";
        var airTableID = "#" + tickSection + "_airline_table tr";

        $(checkboxID).each(function() {

            if ( $(this).is('checked') ) {
                alert("Checkbox is Checked.");
            }

            $(this).attr('checked','checked');

        });

    });

});

What I’m trying to do is write a jQuery to allow users click a link (as an image). When the users click on this image, it will then ‘checked’ all the checkbox specified. It will then I got the Selector expected warning from my Firebug.

The jQuery itself is working as I expected. I just want to try to fix warning.

Anyone can help? I would really appreciate it.

Thank heaps for your thought.

Answer 1

In addition to the other answers, this can be simplified even further, like this:

$("img[id$='_tick']").click(function() {
  var tickSection = this.id.slice(0,1);

  var checkboxID = "input[id^='" + tickSection + "_checkbox_']";
  var airTableID = "#" + tickSection + "_airline_table tr";

  $(checkboxID).each(function() {
      if (this.checked) {
          alert("Checkbox is Checked.");
      }
      $(this).attr('checked', true);
  });
});

A few things here:

• you don’t need a .each(), just .click() and it’ll bind to all of them.
• use DOM properties when available, e.g. this.id and this.checked
• the selector for checkboxID had extra quotes, remove them

Likely without the debugging, it’s even simpler, as .attr() works on multiple elements as well:

$("img[id$='_tick']").click(function() {
  $("input[id^='" + this.id.slice(0,1) + "_checkbox_']").attr('checked', true);
});