ansaurus

Question

Not able to tick Checkboxes using JQuery

Answer 1

A:

Try ('#'+element[0]+'_1').click();

Jonathan Julian 2010-02-20 16:56:08

What if it's checked already? Won't this uncheck it in that case?

Pekka 2010-02-20 17:09:15

You could use :not(:checked) to only select unchecked inputs

Simon 2010-02-20 17:34:44

Answer 2

A:

Changing the checked state could perhaps trigger an onchange event, but certainly not a click event, so that is irrelevant.

You should not set the attribute to true but "checked".

$('#'+element[0]+'_1').attr('checked', 'checked');

See this FAQ entry.

Guffa 2010-02-20 16:58:47

I tried that already, but that doesn't work either! But I should be using that as best practice?

Abs 2010-02-20 17:00:05

@Abs: According to the jQuery FAQ, yes you should. If it still doesn't work, verify that the element actually has that id (not just as name) and that you don't have duplicate id's.

Guffa 2010-02-20 17:04:47

**The FAQ is wrong.** `attr` sets (for the most part, except for a couple of workarounds) JavaScript properties and **not** HTML attributes. This is clear: if you set the `checked` HTML attribute that *does not affect* the checkedness of the checkbox, only the `defaultChecked`ness to which that attribute maps. jQuery is setting the property, and thus the correct value to set it to is `true`. Though `'checked'`, like any other non-empty string value will still work because it is truthy.

bobince 2010-02-20 17:12:28

I can confirm that I do not have duplicate elements, that a checkbox with that ID exists and is not duplicated.

Abs 2010-02-20 17:12:58

Answer 3

+2 A:

One thought is:

If you have more than one chk_1, chk_2, chk_3 ids in your html, the $('#'+element[0]+'_2').attr('checked', true); will only effect the first one in your document.

I ran the code you supplied as such:

html

...
<body>
    <input type="checkbox" id="el1" onclick="checker($(this).attr('id'));" />Text<br />
    <input type="checkbox" id="el2" onclick="checker($(this).attr('id'));" />Text<br />
    <input type="checkbox" id="el3" onclick="checker($(this).attr('id'));" />Text<br />
</body>
</html>
<script type="text/javascript">
    init();
</script>

javascript

function init () {
    $('#el1').attr('checked', true); 
    $('#el2').attr('checked', true); 
    $('#el3').attr('checked', true); 
}
function checker(id)
{
    alert(id);
}

The init function here checks all of the boxes after the document has loaded. Is there any other info that you could give us help out.

I like to reduce examples like this to the simplest code that fails.

lillq 2010-02-20 17:37:15

OMFG thank you for mentioning document has loaded - I wrapped my JS functions with `$(document).ready(function() {` and everything works now! I can't believe this. What a waste of time, apologies everyone as well! I will edit my question.

Abs 2010-02-20 17:43:50

Glad to help out.

lillq 2010-02-20 17:51:20

ansaurus

tags:

views:

answers:

Not able to tick Checkboxes using JQuery

Update

Update 2

Update - Solution

related questions