jquery create checkbox list dynamically

Martin b
Martin b
Member
14 Points
2 Posts

Hi,

jquery create checkbox list dynamically?

Views: 13763
Total Answered: 1
Total Marked As Answer: 1
Posted On: 09-Aug-2015 23:46

Share:   fb twitter linkedin
Answers
Rahul Maurya
Rahul M...
Teacher
4822 Points
23 Posts
         

Hi Martin b,

 A checkbox is an input element with a type attributes of "checkbox". So you can do as following example do.

<div id="cblist"> 
<input type="checkbox" value="first checkbox" id="cb1" /> 
<label for="cb1">first checkbox</label>
</div>
<input type="text" id="txtName" />
<input type="button" value="Add Check box" id="btnSave" />
<script type="text/javascript">
$(document).ready(
function () {
$('#btnSave').click(function () {
addCheckbox($('#txtName').val());
});
});
 
function addCheckbox(name) { 
var container = $('#cblist'); 
var inputs = container.find('input'); 
var id = inputs.length + 1;
$('<input />', { type: 'checkbox', id: 'cb' + id, value: name }).appendTo(container);
$('<label />', { 'for': 'cb' + id, text: name }).appendTo(container);
}
</script> 

 In Above example we add new check box with the given value.

 

Posted On: 12-Aug-2015 22:57
thanks
 - Martin b  11-May-2018 20:32
 Log In to Chat