Check Box validation is not working using javascript

Question

Whenever Delete button is clicked without selecting any Checkbox it gives validation -thats proper Whwnever checkbox is selected and button is clicked, also it shows the validation. Where am i going wrong ?

<tr>
    <td>
        <input type='checkbox' name='check1' value = '80'>Q- 80. Statute of Liberty is in ?
    </td>
</tr>
<tr>
    <td>
        <input type='checkbox' name='check1' value = '64'>Q- 64. National Animal ?
    </td>
</tr>
<tr>
    <td>
        <input type='checkbox' name='check1' value = '65'>Q- 65. Popular language
    </td>
</tr>
<tr>
    <td>
        <input type='checkbox' name='check1' value = '63'>Q- 63. Largest Ocean ?
    </td>
</tr>

JS:

function Checked(){
    var chk=false;

    if (document.myForm.check1.checked){
        chk=true;
        return chk;
    } else {
        alert("Please select Checkbox");
        return chk;
    } 
}

My Function call:

<input type="submit" name="delete" formmethod='post' formaction='/~xyz/cgi-bin/Project/CheckDelete.py' value="Delete" onclick="return Checked()">

if you want to use jquery this will be simple forward ? – Sunil Verma Nov 26 '13 at 10:00 — Sunil Verma, Nov 26 '13 at 10:00

Praveen · Accepted Answer · 2013-11-26T10:42:48.583

0

document.myForm.check1.checked

As @CBroe adviced, this statement didn't worked because you're having having multiple checkboxes.

So you need to iterate.

 var d = document.myForm.check1;
    var arr = 0;
    for (var i = 0; i < d.length; i++) {
        if (d[i].checked) {
            arr++;
        }
    }

Here I have created a variable arr, which gets incremented when a checkbox is checked.

At last I will check like

if (arr != 0) return true;
    else {
        alert("Please select Checkbox");
        return false;
    }

Finally,

function Checked() {
    var d = document.myForm.check1;
    var arr = 0;
    for (var i = 0; i < d.length; i++) {
        if (d[i].checked) {
            arr++;
        }
    }
    if (arr != 0) return true;
    else {
        alert("Please select Checkbox");
        return false;
    }
}

check this in fiddle

edited Nov 26 '13 at 10:42

answered Nov 26 '13 at 10:01

Praveen

55,303
33
133
164

It's cleaner that way (actually not using a variable would be even better), but how is it supposed to make any difference? – JJJ Nov 26 '13 at 10:02
@Juhana Thanks, I understood the problem. Now I have edited, please have a look at it. – Praveen Nov 26 '13 at 10:36
what is this console.log ?? i am not getting that – Amy Nov 26 '13 at 10:40
@user3003685 Not necessary , *FYI:* `console.log` is like printing the output in the console screen (press f12 in browser and go to console). It will be useful for debugging the JS. I guess you're new to JS. – Praveen Nov 26 '13 at 10:42
@user3003685 check this question http://stackoverflow.com/questions/4539253/what-is-console-log to learn about `console.log`. – Praveen Nov 26 '13 at 10:44
It worked perfectly....And i got it. console.log is just like printing log to a some file – Amy Nov 26 '13 at 10:51

score 0 · Answer 2 · answered Nov 26 '13 at 10:05

0

Since you have multiple input fields with that name, document.myForm.check1 will be a NodeList, and that has no checked property.

What you want to do, is loop through your checkboxes, and check their status individually. If in that loop you encounter one that is checked, you can leave the loop by returning true, otherwise you return false after your loop.

answered Nov 26 '13 at 10:05

CBroe

91,630
14
92
150

you mean for(var i=0; i – Amy Nov 26 '13 at 10:09
`"check1"` in double quotes in this case of course. Or just keep using `document.myForm.check1`, that has a `length` property as well (as long as you have more than one form element with that name, otherwise it won’t be a NodeList but reference that element directly). – CBroe Nov 26 '13 at 10:34

Check Box validation is not working using javascript

2 Answers2