How to check a checkbox with boolean values
Question
So the HTML spec says that you should add a checked attribute to the <input type="checkbox"> tag to mark it as checked. But I only have a boolean true or false value.
As by design, I can't add any logic to the boolean value before it get parsed to html :(. Is it possible to check a Checkbox with a Boolean value on load just with html or js? I tried the following, but the onload seem not to trigger:
<input type="checkbox" onload="javascript:this.checked=true" />
I know that I can do something like this in jQuery:
$("[checked='false']").prop('checked',false)
I am looking for an elegant way to solve it. This must parse the whole DOM-Tree and would slow down my page.
Edit (trying to explain):
In my company there exist a application that does the following by design:
<input type="checkbox" checked="%IsValide%" >
The Server than automatically replaces the %IsValide% var with a database value. Here true or false. But then the checkbox is always checked, even if the value is false. I am aware that this is because of the design of html5: checked="true" and checked="false" will marke the checkbox always as checked.
Now I'am searching for a solution to use the true or false value from %IsValide% to check the box correctly with javascript (or even better, with html.). I can use the %IsValide% at any position in the html tag. For example:
<input type="checkbox" onload="javascript:this.checked=%IsValide%" />
But I can not add logic before it get parsed to HTML like this:
if(%IsValide%) {
%IsValide%="checked";
}
else {
%IsValide%="";
}
3 answers
solution1
4 2014-11-12 15:06:17
I'm trying to understand what your asking. I'm thinking that you could accomplish it with some simple javascript:
document.getElementById("yourCheckBoxId").checked = false; //this case it sets checked to false you can also do true
to check it on page load:
<body onload='document.getElementById("yourCheckBoxId").checked = true;'>
or avoid the onload attribute for body for checking it do this:
<input type="checkbox" id="yourCheckBoxId" checked>
Then you just change it with javascript.
My other guess is that your wanting to change the value of the checkbox? Are you? Post a comment below my answer saying that I didn't understand what you are asking. Hope this helps! Here is my reference source: http://www.w3schools.com/jsref/prop_checkbox_checked.asp
solution2
0 2014-11-12 14:47:38
If your company's application sets checked="true" or checked="false" as you can see, this will not matter since checked is a boolean attribute and "the presence of this Boolean attribute indicates that the control is selected by default", and the checkbox will always be checked.
This should fix it:
$('input[checked="false"]').prop('checked',false)
solution3
0 2014-11-12 15:04:54
I think ultimately you're going about this the wrong way, but if I had no other option like you're saying, I think the best you'll end up with (performance wise) would be to add a class to your input (true or false)
<input type="checkbox" class="tocheck-true"></input>
<input type="checkbox" class="tocheck-false"></input>
and then look for that class:
$("input.tocheck-true").prop("checked",true);
Because we're searching only for inputs that have that css class, this should perform very well.
But, again, this seems like a complete hack. If you're asking "how can I use duct tape to secure the engine to the body of my car," maybe you should stop to see if you should even be asking that question. :)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.