I'm trying to create a drop down list from a MySql.
The php is successfully fetching the data from the MySql. But my problem is the data is not showing on the drop down list in my HTML page?
json_mysql_data2.php
header("Content-Type: application/json");
require_once("con.php");
$i=0;
$jsonData = array();
foreach ($conn_db->query("SELECT customerID FROM customers WHERE furniture='33' ") as $result){
$i++;
$jsonData["article".$i]=$result['customerID'];
}
echo json_encode($jsonData);
myJS.js
$(document).ready(function(){
var ddlist = document.getElementById("ddlist");
var hr = new XMLHttpRequest();
hr.open("GET", "json_mysql_data2.php", true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var d = JSON.parse(hr.responseText);
for(var o in d){
if(d[o].title){
ddlist.innerHTML += '</option><option value='+d[o].title+'</option>';
}
}
}
}
hr.send("null");
ddlist.innerHTML = "Loading Customer
ID....";
});
html
<script src="myJS.js" type="text/javascript"></script>
</head>
<body>
<div class="dlist">
Customer ID:
<select id='EmpLst' name="dwlist" onchange='document.getElementById("val1").value = this.value;'><option value="">SELECT STUDENT ID</option>
<div id="ddlist"></div>
</select>
</div>
