Hi, say I have <input type="checkbox" id="box1" /> and <div id="createhere"></div> and in a javascript file I have:

function(){
    var box=document.getElementById("box").checked;
    var s = "";
    if(box){
        s = "<input type="text" name="text" id="text" />"
        document.getElementById("createhere").innerHTML = s;
    }else{
        s = "";
        document.getElementById("createhere").innerHTML = s;
    }
}

Now this works BUT it only creates the text box when I refresh the browser(firefox). How can I do the same without refreshing the browser?

Recommended Answers

All 4 Replies

You are missing an event to trigger the function. For example ...

 <input type="checkbox" id="box1" onclick="Function Name(argument)">

You'll need to determine the checked state of your checkob. For example after the checkbox is checked, what if the user I checks it.

is onclick=function() on javascript library? The challenge is that I cannot use any javascript in my HTML file, all javascript related code MUST be contained in a javascript file.

Yes, you can do this from your javascript code without modifying your HTML markup.

for example..

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<input type="checkbox" id="box1" />
<div id="createhere"></div>

<script>

document.getElementById('box1').onclick = function() {
    if (document.getElementById('box1').checked) {
        s = "<input type='text' name='text' id='text' />";
        document.getElementById("createhere").innerHTML = s;
    } else {
        document.getElementById("createhere").innerHTML = "";
    }
}

</script>

</body>
</html>

tnx, that totally worked

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.