current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I am stuck at the simple JavaScript function, related to the checkbox validation. I need to document.write if the cb1 is checked, and the same if cb2. And if both, or one of them isn't checked, then write nothing.

<html>
<head>
<title>TEST PAGE</title>
    <script type="text/javascript" src="submit.js"></script>
</head>
<body>
    <div style="width:100%"><input type="checkbox" id="cb1"></div>
    <div style="width:100%"><input type="checkbox" id="cb2"></div>

    <div style="width:100%"><input type="submit" name="execute" id="execute" value="Execute" onClick="run();"></div>

</body>
</html>

submit.js

function run() {

    document.write('<div>' + "HERE GOES YOUR CHECKBOX CHOICE: " + '</div>');

    if(document.getElementById("cb1").checked == true) {
        document.write("This is check box 1");
    }
    if(document.getElementById("cb2").checked == true) {
        document.write("This is check box 2");
    }
}
share|improve this question
    
What exactly is the problem you're having? Are you looking for a jQuery solution? You used the tag but no jQuery code. –  Blazemonger Feb 26 at 16:59

4 Answers 4

up vote 2 down vote accepted

Here is an improved run function:

function run() {

    var snip = "<div>HERE GOES YOUR CHECKBOX CHOICE: </div>";

    if(document.getElementById("cb1").checked == true) {
        snip += "<br/>This is check box 1";
    }
    if(document.getElementById("cb2").checked == true) {
        snip += "This is check box 2";
    }
    document.write(snip);
}

Everyone spotted the error of overwriting you html before actually reading the elements, so that was the cause of your error, clearing the DOM and then trying to read an input property that no longer exists.

share|improve this answer
    
This is what I need. Thank you for solution. –  mpavlovic89 Feb 26 at 17:18
up vote 1 down vote

you shouldnt use document.write. use append to tags like

$("#divid").append($("<input/>",{type:"checkbox",onclick:"yourfunction(this)"}));
share|improve this answer
up vote 0 down vote

just use .checked in javascript in jquery use .prop('checked') 

function run() {    

if(document.getElementById("cb1").checked) {
    document.write("<div>This is check box 1</div>");
}
if(document.getElementById("cb2").checked) {
    document.write("<div>This is check box 2</div>");
}
}
share|improve this answer
up vote 0 down vote 
if (document.getElementById('cb1').checked && document.getElementById('cb2').checked) {
    // both are checked
}
else {
   // only one or none are checked
}

As was mentioned in one of the previous answers, you should not use document.write. You can use .append(string) to add things to the document:

document.append('Both boxes are checked');
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.