Sachith Sachith - 2 months ago 9
Javascript Question

How to populate checkboxes using JavaScript in Laravel 5.2

I want to populate a list of check boxes dynamically using JavaScript. I have done the following:

In my

balde view
:

<div id="demo" class="collapse" >
<div class="panel panel-default" >
<div class="panel-body" id="demos" style="max-height: 100px;overflow-y: scroll;" >

<input type="checkbox" name="specific[]" value=" "> <br>

</div>
</div>
</div>


My script:

$(document).ready(function(){
$('#ItemID').on('change',function(e){
console.log(e);
var itemID= e.target.value;


$.getJSON('/xxxxx/list?itemID=' + itemID, function(data){
$('#demos').empty();
$.each(data,function(index, subcatlist){
$('#demos').append('<input value="'+subcatlist[0].ID+'">'+subcatlist[0].Name+'</input>');
});
});
});
});


route.php
passes wanted data.

I want my view to be like this, a checkbox followed by Names:

Expected result

But what I'm getting is this:

Actual result

I am getting Names to the view, but the leading check box is missing and replaced with a textbox. How do I fix this problem?

Answer

Try this :

$('#demos').append('<input type="checkbox" value="' + subcatlist[0].ID + '"/>' + subcatlist[0].Name);

I think this will solve the problem.