<script>
window.addEvent('domready', function(){
getJSON('name');
$$('.link').addEvent('click', function(e) {
getJSON(this.get('rel'));
});
});
function getJSON(rel){
new Request.JSON({
onFailure: function(){alert('Error');},
onRequest: function(){$('box').set('text', 'Loading...');},
onSuccess: function(person){dataJSON(person);},
url:'json_array.php'
}).get({
sort:rel
});
}
function dataJSON(data){
$('box').empty();
Array.each(data, function(el, index){
date = el.name+'.....'+el.age+'......'+el.height+'.........'+el.weight;
new Element('div',{id:'line',html:date}).inject($('box'));
});
}
</script>
<style>
#line{border-top:1px solid #ccc;padding:5px}
</style>
<b class=link rel=name>Name</b> | <b class=link rel=age>Age</b> | <b class=link rel=height>Height</b> | <b class=link rel=weight>Weight</b>
<div id='box'></div>
<?php
$result =array(
array('name' => 'Mike','age' => '25', 'height' => '178','weight'=>'75'),
array('name' => 'Fred','age' => '22', 'height' => '188','weight'=>'99'),
array('name' => 'Aron','age' => '32', 'height' => '168','weight'=>'80'),
array('name' => 'Will','age' => '31', 'height' => '158','weight'=>'52'),
array('name' => 'Zoie','age' => '18', 'height' => '178','weight'=>'55'),
array('name' => 'July','age' => '45', 'height' => '155','weight'=>'70')
);
function subval_sort($a,$subkey,$sort) {
foreach($a as $k=>$v) {
$b[$k] = strtolower($v[$subkey]);
}
$sort($b);
foreach($b as $key=>$val) {
$c[] = $a[$key];
}
return $c;
}
if(isset($_GET['sort'])){
$result = subval_sort($result,$_GET['sort'],'asort');
}
echo json_encode($result);
?>
Related Posts
JSON, MooTools - JSON