javascript - How to create a Checkbox list data from database using jquery - Stack Overflow

guy's i need your help to solve my problem. i want to make a checkboxlist using data from database but i need to use jquery for making it

before of it. i have an example of making a checkboxlist with php. i want to change it into jquery but i dont know how

this just a small of code for make a checkbox using php. i want to make a code for making a checkboxlist but need to use jquery. is that possible to do that?

<input type="checkbox" name="students[]" value="'.$stud.'" />Test

guy's i need your help to solve my problem. i want to make a checkboxlist using data from database but i need to use jquery for making it

before of it. i have an example of making a checkboxlist with php. i want to change it into jquery but i dont know how

this just a small of code for make a checkbox using php. i want to make a code for making a checkboxlist but need to use jquery. is that possible to do that?

<input type="checkbox" name="students[]" value="'.$stud.'" />Test

• javascript
• php
• jquery

Share Improve this question Follow asked Jul 11, 2017 at 7:04 Minervaz MineMinervaz Mine 27311 gold badge33 silver badges1818 bronze badges 3

• Do you have any PDO or DB connection coding already made? – Jacob Webb Commented Jul 11, 2017 at 7:06
• i've made that. i just need the jquery for calling the PHP function (include the DB conn and PDO) into a checkboxlist.. – Minervaz Mine Commented Jul 11, 2017 at 7:07
• can you help me to give me an example of the code ? – Minervaz Mine Commented Jul 11, 2017 at 7:08

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

You need to add the checkbox in some html container.

<div id="append" name="append">Append here</div>

First you have to make ajax call it will give you response in array and then on that response you have to call each function which will dynamically append check boxes to html.

$.each(data,function(index,value){
    var checkbox_label = value;
    var checkbox_value =value;
    var checkbox_name = 'students['+index+']';
    var template = '<input type="checkbox" name="'+checkbox_name+'" value="'+checkbox_value+'">'+checkbox_label;

  $("#append").append(template);
});

Using jQuery you can generate dynamic checkboxes.

for(var i=1;i<=6;i++){
    var $chk = $('<input type="checkbox" name="chk_'+i+'" />Test '+i+"<br />");
    $("#box").append($chk);
}

<script src="https://ajax.googleapis./ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<div id="box"></div>  

Here you go with the solution https://jsfiddle/w2Lmqmcu/1/

var data = ["Student 1", "Student 2", "Student 3", "Student 4"]; // I'm expecting your data will be similar to this

$.each(data, function(index){
	$('.checkboxlist').append("<input type='checkbox' name='students[]' value='" + data[index] + "' />" + data[index] + "<br/>");
});

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="checkboxlist">

</div>

Please update the question with your database response, so that we can answer it more accurately.