simple code to populate items into a Select using jQuery ajax json, php on first menu change it must make ajax call to fruit-varities.php to get a json array and create the second menu main page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Load JSON data with jQuery, PHP and MySQL</title>
<link rel="stylesheet" type="text/css" href="/css/main.min.css?1319445416" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#mark').change(function() {
$.get("fruit-varities.php",
{'idcategory' : idc },
function(data){
var select = $('#series').empty();
$.each(data.values, function(i,item) {
select.append( '<option value="'
+ item.fruit_id
+ '">'
+ item.name
+ '</option>' );
});
}, "json");
});
});
</script>
</head>
<body>
<form>
<select id="mark">
<option value="">--</option>
<option value="bmw">BMW</option>
<option value="audi">Audi</option>
</select>
<select id="series">
</select>
<div id="view">
</div>
</form>
</body></html>
and here is fruit-varities.php
<?php
if(isset($_GET['idcategory'])){
$item = Array(
Array
(
"fruit_id" => "1",
"name" => "Apple",
"variety" => "Red Delicious"
)
);
}
echo json_encode(item);
?>
this is doesn't work at it all don't know why ? everything seems to be fine for me but i don't know what is the problem
You don't have "idc" variable in your page, but you are using it as an Ajax request parameter's value. It does not metter, what value 'idcategory' parameter should have (by analyzing your php script), so you could replace {'idcategory' : idc } with {'idcategory' : ''}.