Currently I'm using this to check / uncheck all checkboxes in my form.
<script type="text/javascript">
checked=false;
function checkedAll (frm1) {
var aa= document.getElementById('frm1');
if (checked == false)
{
checked = true
}
else
{
checked = false
}
for (var i =0; i < aa.elements.length -2; i++)
{
aa.elements[i].checked = checked;
}
}
</script>
This works well, But I have one check box within this form I don't want to be affected.
It has an id of id='ignore' is there anyway the above code can be used to work as is, but ignore this one checkbox ?
Thanks
for (var i =0; i < aa.elements.length -2; i++)
{
if(aa.elements[i].id !== 'ignore'){
aa.elements[i].checked = checked;
}
}
Get rid of the if loop also...
The full code -
<script type="text/javascript">
var checked = false;
function checkedAll (frm1) {
var chkBoxs = document.getElementById('frm1').getElementsByTagName('input');
checked = !checked;
for (var i =0; i < chkBoxs.length -2; i++) {
if (chkBoxs[i].id == 'ignore') {
continue;
}
chkBxs[i].checked = checked;
}
}
</script>
for (var i =0; i < aa.elements.length -2; i++)
{
if (aa.elements[i].getAttribute('id') != 'ignore')
aa.elements[i].checked = checked;
}
for (var i =0; i < aa.elements.length -2; i++)
{
if (aa.elements[i].getAttribute('id') == 'ignore')
continue;
aa.elements[i].checked = checked;
}
<script type="text/javascript">
checked=false;
function checkedAll (frm1) {
var aa= document.getElementById('frm1');
if (checked == false)
{
checked = true
}
else
{
checked = false
}
for (var i =0; i < aa.elements.length -2; i++)
{
if (aa.elements[i].getAttribute('id') == 'ignore')
aa.elements[i].checked = false;
else
aa.elements[i].checked = checked;
}
}
</script>
Related
Trying to change the background color of all my divs using a onkeypress event. R = Red , B=White, V=Green. When press R it works but when i press V or B it gives me the alert.
I tried without return, with a switch(actualy im supposed to do this with a switch). Teacher cancelled class today so I wasnt able to check it out with him .And I Wont see him til next week. I tried things and other things for 2-3 hours and im totaly stuck Please help.. Thanks in advance
window.onkeypress = function colorchange(x)
{
if (x.keyCode == 114)
{ var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "red";
}return;
}
if (x.keycode == 118)
{
var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "green";
}return;
}
if (x.keycode == 98)
{
var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "white";
}return;
}
else
{
alert("this key doesnt do anything")
}
}
}
The variables are case-sensitive. You have keycode and it should be keyCode. Looks like you should also be using else if().
window.onkeypress = function colorchange(x) {
if (x.keyCode == 114) {
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
divs[i].style.backgroundColor = "red";
}
return;
} else if (x.keyCode == 118) {
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
divs[i].style.backgroundColor = "green";
}
return;
} else if (x.keyCode == 98) {
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
divs[i].style.backgroundColor = "white";
}
return;
} else {
alert("this key doesnt do anything")
}
}
body {
background: #eee;
}
div {
width: 100px;
height: 100px;
background: #aaa;
}
<div></div>
You are comparing x.keycode instead of x.keyCode in the second and third if statements. You should also chain the conditions using else if.
window.onkeypress = function colorchange(x)
{
if (x.keyCode === 114) {
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "red";
}
return;
}
else if (x.keyCode === 118)
{
var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "green";
}
return;
}
else if (x.keyCode === 98)
{
var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++)
{
divs[i].style.backgroundColor = "white";
}
return;
}
else
{
alert("this key doesnt do anything")
}
}
See working jsfiddle here.
I am trying to check boxes in JS. I wan't to only check when the value is equal to 0, if not don't check it. my code :
document.onreadystatechange = function check(e)
{
if (document.readyState === 'complete')
{
var inputElements = document.getElementsByTagName("input");
for(var i=0; i < inputElements.length; ++i)
{
if(document.getElementsByTagName("input")[i].value == "1")
{
document.getElementById("date").checked = false;
}
}
}
}
But it doesn't work. Can you help me?
thanks
What you are doing is, if the checkboxes have value of 1, then you are checking it. Make this change in the code and it should work. Also, you need to check if you are doing this on a checkbox and not on a radio or text:
if(document.getElementsByTagName("input")[i].value == 0 &&
document.getElementsByTagName("input")[i].getAttribute("type") == "checkbox")
{
document.getElementById("date").checked = true;
}
var eles = document.querySelectorAll("input[type='checkbox']");
var len = eles.length,
i = 0,
flag = true;
for (; i < len; i++) {
if (eles[i].value === "1") {
flag = false;
return;
}
}
if (flag) document.getElementById('date').checked = true;
If the value ( 0 or 1 ) is of an <input type='text'>, then change document.querySelectorAll("input[type='checkbox']"); to document.querySelectorAll("input[type='text']");
it seem i solve this question myself~
in a simple and stupid way :
Checkall Box
var tab = document.getElementById("tbl");
var elems = tab.getElementsByTagName("input");
var len = elems.length;
for (var i = 0; i < len; i++) {
if (tab.checked == elems.checked)
{
elems[i].checked = true;
}
}
UncheckAll Box :
for (var i = 0; i < len; i++) {
if (tab.checked == elems.checked)
{
elems[i].checked = false;
}
}
it seem i solve this question myself ~~
Checkall Box
var tab = document.getElementById("tbl");
var elems = tab.getElementsByTagName("input");
var len = elems.length;
for (var i = 0; i < len; i++) {
if (tab.checked == elems.checked)
{
elems[i].checked = true;
}
}
}
UncheckAll Box :
for (var i = 0; i < len; i++) {
if (tab.checked == elems.checked)
{
elems[i].checked = false;
}
}
}
I've got a function to select all checkboxes in a table:
<script type="text/javascript">
function checkAll() {
var tab = document.getElementById("logs");
var elems = tab.getElementsByTagName("input");
var len = elems.length;
for (var i = 0; i < len; i++) {
if (elems[i].type == "checkbox") {
elems[i].checked = true;
}
}
}
But I can't get it to uncheck them all if they are checked. How could I do that?
<th width='2%'>Mark</th>";
Also in javascript is it possible to rename "Mark" to "Un-Mark" if I execute checkAll()?
This should do both of the things u want:
function checkAll(obj) {
var tab = document.getElementById("logs");
var elems = tab.getElementsByTagName("input");
var len = elems.length;
for (var i = 0; i < len; i++) {
if (elems[i].type == "checkbox") {
if(elems[i].checked == true){
elems[i].checked = false;
}
else{
elems[i].checked = true;
}
}
}
if(obj.innerHTML == 'Mark') { obj.innerHTML = 'Unmark' }
else { obj.innerHTML = 'Mark' }
}
html:
<th width='2%'>Mark</th>";
1) why don't u use some js framework, like jQuery?
2) to remove checked, use elems[i].removeAttribute('checked') or set elems[i].checked = false;
3) to rename, you have to set it's innerHTML or innerText to Un-Mark
Add a little more logic to see if they're already checked. This will invert their current checked state.
for (var i = 0; i < len; i++) {
if (elems[i].type == "checkbox") {
if (!elems[i].checked) {
elems[i].checked = true;
}
else elems[i].checked = false;
}
}
If you just want to uncheck all, simply use:
elems[i].checked = false;
This will check them all regardless of their current state, or uncheck them all, depending on the current text of "Mark" or "Unmark".
<script type="text/javascript">
function checkAll(obj) {
var tab = document.getElementById("logs");
var elems = tab.getElementsByTagName("input");
var len = elems.length;
var state = obj.innerHTML == 'Mark';
for (var i = 0; i < len; i++) {
if (elems[i].type == "checkbox") {
elems[i].checked = state;
}
}
obj.innerHTML = state ? 'Mark' : 'Unmark';
}
And then the HTML changes to:
<th width='2%'>Mark</th>";
To uncheck, try:
elems[i].checked = false;
i sugest you use jquery, everything is easier.
with jquery you just have to do something like this (+/-):
$(function(){
$('a.ClassName').click(function(){
var oTbl = $('#tableID');
$('input[type="checkbox"]', oTbl).attr("checked", "checked")
});
})
How can I deselect all checkboxes using JavaScript?
You can do something like this:
function uncheckAll(){
var frm = document.getElementById('your form id');
for (var i = 0; i < count(frm.elements.length); i++){
if (frm.elements[i].type === 'checkbox'){
frm.elements[i].checked = false;
}
}
}
And to check them all back:
function checkAll(){
var frm = document.getElementById('your form id');
for (var i = 0; i < count(frm.elements.length); i++){
if (frm.elements[i].type === 'checkbox'){
frm.elements[i].checked = true;
}
}
}
You just have to call those functions.