11

Okay, so I'm trying to change a checkbox's state programmatically in dashcode. I've tried:

var checkbox = document.getElementById("checkbox");

// I have tried all the following methods.
checkbox.checked = false;
checkbox.selected = false;
checkbox.value = false;
Andy E
  • 338,112
  • 86
  • 474
  • 445
Daniel
  • 111
  • 1
  • 1
  • 3
  • you can use checkbox.checked = false but don't use setAttribute('checked','checked'), It may seem working, but it fails if you have clicked the checkbox manually and then try to check or uncheck using setAttribute('checked','checked') or removeAttribute('checked') – jforjs Nov 30 '16 at 13:13
  • refer my recent post for this, http://jforjs.com/setattribute-removeattribute-checkbox/ – jforjs Nov 30 '16 at 13:14

8 Answers8

23

Dashboard Widgets just run on WebKit technologies, so code valid for Safari should also be valid in Dashcode. Either of the following should work:

checkbox.checked = true;
checkbox.setAttribute("checked", "true");

The fact that they are not working indicates there is a problem elsewhere in your code. I would check the line

var checkbox = document.getElementById("checkbox");

Correctly assigns an element to the checkbox variable. Also, check the id of your "checkbox" element is valid and correct (not a duplicate, doesn't have a typo, etc).

Andy E
  • 338,112
  • 86
  • 474
  • 445
  • Yeah, I've thought that it might be that, but I've quadruple checked, the ID is "checkbox" and the code is checkbox = document.getElementById("checkbox"); I don't get any errors on runtime. I am running it in a stacklayout, would that change anything? – Daniel Mar 21 '10 at 22:26
  • This is the answer, particularly the first version (no need to go anywhere attributes). If setting the `checked` property isn't working then the fault lies elsewhere. – Tim Down Mar 22 '10 at 00:22
  • I just ran a test, its setting the checked property, however its not updating the checkbox. Also, through some more tests, initially it says the checked variable is undefined. – Daniel Mar 22 '10 at 01:52
  • Just for someone confused with some abnormal behaviour of this, `checkbox.checked = true;` is more reliable in general. – Sankalp Sharma Oct 06 '16 at 08:54
  • setAttribute will not change the input visually (as though you clicked on it). @Rogello 's answer does. This is true in chrome anyway. – Cybernetic Jun 19 '23 at 22:25
7

This question is one month old as I write this answer. It was probably already solved, but in any case I would like to add that if you are using Dashcode, the Checkbox part is a div which contains one label and one input, this one being the "real" checkbox.

If you inspect the html as it is loaded in Safari you will notice that "checkbox" is the type of the element.

Therefore the proper way to change the state of the checkbox would be, assuming "input" is its id (it could have a default number attached though):

document.getElementById("input").checked="true";

or whichever method you want to use.

The main point here is that you were trying to change the state of another div.

Hope it helps!

Paul D. Waite
  • 96,640
  • 56
  • 199
  • 270
Rogelio
  • 71
  • 1
  • This is correct. The OP is probably trying to change the state of the parent DIV element to 'checked'. – mclaughj Aug 21 '10 at 09:32
2
checkbox.setAttribute("checked", "checked"); // set
checkBox.removeAttribute("checked"); // remove
Jaanus
  • 17,688
  • 15
  • 65
  • 110
  • 1
    Thanks for pointing out the checkBox.removeAttribute("checked");. I tried checkbox.setAttribute("checked", false); which, of course, did not work. – codemonkey Apr 15 '20 at 02:32
1

I don't know which browser you used, but when I tested on FF 3.6, it works. just put like this:

checkbox.checked = false;

while: 

checkbox = document.getElementById('blablabla');

or write like that

document.getElementById('idhere').checked = false;
Prasad Jadhav
  • 5,090
  • 16
  • 62
  • 80
thang
  • 11
  • 1
1

This question has been around a while. Regardless, the following works for us:

checkbox.childNodes[1].checked = true; checkBox.childNodes[1].checked = false;

As pointed out in a previous answer, the way Dashcode creates these controls you need to get past the div wrapper, which has the actual ID (checkbox in this example) and set the property for the input, which is child node 1.

Looking for the actual 'id' of the input would be problematic as you have no control over what id's are assigned to the node. For example if you have two checkboxes then the first one would have 'input' as the id for child node 1 and the second one 'input1', unless, of source you have used 'input' or 'input1' as an id somewhere in your design already!

There might be another method but I have not found it yet.

cameron
  • 156
  • 1
  • 1
  • 12
0

Maybe:

checkbox.checked = "checked";

Then:

checkbox.checked = "unchecked";
Lucas Jones
  • 19,767
  • 8
  • 75
  • 88
  • OK. I've no experience with Dashcode, but it looks like HTML. :) Hopefully someone more experienced will be able to help you here. – Lucas Jones Mar 22 '10 at 00:35
0
cell = row.insertCell(-1);
sel = document.createElement('input');
sel.setAttribute("type", "checkbox")
sel.setAttribute("name", "myCheckBox")
cell.appendChild(sel);
cell.getElementsByTagName('input')[0].checked = true;

I create a table, row then cell and create a checkbox within it. I can the grab hold of the first input object and set the checked status to true.

Steve Morley
  • 1
-5
var checkbox = document.getElementById("checkbox");

there is a problem with this line, it should be

var checkbox = document.getElementById('#checkbox");
Syed mohamed aladeen
  • 6,507
  • 4
  • 32
  • 59
Iria
  • 433
  • 1
  • 8
  • 20