Click here to Skip to main content
14,661,175 members
Rate this:
Please Sign up or sign in to vote.
See more:
Hi

I want to create checkbox dynamically with some label .i done this but getting some error please help to remove this error..
<html>
<head>
<script type='text/javascript'>
function createCheckBox(){
var checkbox = document.createElement('input');
checkbox.type = "checkbox";
checkbox.name = "name";
checkbox.value = "value";
checkbox.id = "id";
var label = document.createElement('label')
label.htmlFor = "id";
label.appendChild(document.createTextNode('label');
var container = document.getElementById('checkbox_here');
container.appendChild(checkbox);
container.appendChild(label);
}
</script>
</head>
<body>
<input type='button' value='Create Checkbox' onClick='createCheckBox()' />
<div id="checkbox_here"></div>
</body>
</html>
Posted
Updated 26-Oct-12 18:21pm
v2
Comments
ravi1989h 27-Oct-12 0:31am
   
Actually i just create a check-box (having some text)example :do you want ?. dynamically but i am getting error.

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

<html>
   <head>
   <script language="Javascript">

     function append()
     {
        var cb = document.createElement( "input" );
        cb.type = "checkbox";
        cb.id = "id";
        cb.value = "test";
        cb.checked = true;
        var text = document.createTextNode( "checkbox" );
        document.getElementById( 'append' ).appendChild( text );
        document.getElementById( 'append' ).appendChild( cb );
     }

   </script>
   </head>
<body>
   <p>click the button below</p>
   <form action="http://localhost/test.php" name="form" id="form" method="post" enctype="multipart/form-data">
   <div id="append" name="append">Append here</div>
   <input type="button" value="append" onclick="javascript:append()" />
   <input type="submit" value="submit" />
   </form>
</body>
</html>



http://bytes.com/topic/javascript/answers/701647-creating-checkboxes-dynamically-document-createelement[^]
   
v2
Comments
ravi1989h 27-Oct-12 0:48am
   
can you please tell me what is the use of this line.
cb.value = "test"; ? what is this ? and what is use if this

In this case i understand this is the text of button
<input type="button" value="append".
ravi1989h 27-Oct-12 0:51am
   
one question more.
what is the use of this name="append" in this line..
<div id="append" name="append">
Sanjeev Alamuri 27-Oct-12 2:48am
   
values means the text for check box.
Every html tag contains the id and name attributes. from script u can call those html tags by using id or name.
let see the example
<div id="append" name="append">
now i can access the div in different ways as follows
document.getElementById("append");
it will return single html tags only i.e div tag only
or
document.getElementsByName("append");
it will rerun the tags which have the name "append".

"ID" is unique and but not "Name" .

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100