populate select box from database using jquery using -'php,jquery,mysql,populate'

populate select box from database using jquery  using -'php,jquery,mysql,populate'

I am trying to populate a select box from values from a mysql database, using jQuery.

db call:

include 'db.php';
$con = mysql_connect($host,$user,$pass);
$dbs = mysql_select_db($databaseName, $con);

$tableName = "tbl_title";
$result = mysql_query("SELECT * FROM $tableName");

$data = array();
while ( $row = mysql_fetch_row($result) )
    $data[] = $row;
//echo json_encode( $data );    


<select id="a1_title">

There are a bunch of examples that I have found, but nothing specifically related to what I am looking for, unless the force is not with me today.

Is there a link someone can point me to?

asked Sep 8, 2015 by rajesh
0 votes

2 Answers

0 votes
The below script will load the dropdown list from the JSON received from the PHP Page. $(function(){ var items=""; $.getJSON("yourPHPPage.php",function(data){ $.each(data,function(index,item) { items+="<option value='"+item.ID+"'>"+item.Name+"</option>"; }); $("#a1_title").html(items); }); }); Assuming the received JSON is in this format [ { "ID" :"1", "Name":"Scott"},{ "ID":"2", "Name":"Jon"} ] Another thing i noticed is that you are doing SELECT * FROM table name to get the items. I do not think you should do that. You should do only two columns (ID & NAME , if you you have those columns in your table.). Here is a JSFiddle example to show how to fetch data from the JSON.
answered Sep 8, 2015 by rajesh
0 votes
I have same problem, your suggestion is work HTML & JS <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script> <title>Insert title here</title> </head> <body> <script type="text/javascript"> $(function(){ var items=""; $.getJSON("get-data.php",function(data){ $.each(data,function(index,item) { items+="<option value='"+item.id+"'>"+item.name+"</option>"; }); $("#a1_title").html(items); }); }); </script> <select id="a1_title"> <option>Default</option> </select> </body> </html> php include 'configurations/db-connections.php'; $q = "select id, name from college"; $sql = mysql_query($q); $data = array(); while($row = mysql_fetch_array($sql, true)){ $data[] = $row; }; echo json_encode($data);
answered Sep 8, 2015 by rajesh