Returned JSON, write with Javascript

Question

Hy all!

I have a little problem. I tried to write an ajax post to get values from a database, and it's returning format is an a JSON object. How can I get the key, and value pairs from it?

the jquery which sending the ajax:

function getTableData() {

 $.post('loader.php',getGetStr(),function(data){
 var json = $.parseJSON(data);
 console.log(json);
 });
 }

The console.log output is:

Object {query-data: Array[3]}
query-data: Array[3]
0: Object
buy_type: "kiado"
condition_type: "uj"
district: "1"
heat_type: "cirko"
id: "1"
lift_type: "all"
parking_type: "all"
price_max: "22"
price_min: "10"
prop_type: "lakas"
room_max: "3"
room_min: "1"
street: "all"
uid: "3"
__proto__: Object
1: Object
2: Object
length: 3
__proto__: Array[0]
__proto__: Object

The php code wich select the rights things, and return the data to the ajax:

$ordering = array ("buy_type " . $_POST['buyType'],"prop_type ".$_POST['propertyType'],"district ".$_POST['disctrict'],
 "street ".$_POST['street'],"room_min ".$_POST['roomMin'],"room_max ".$_POST['roomMax'],
 "price_min ".$_POST['priceMin'],"price_max ".$_POST['priceMax'],"condition_type ".$_POST['conditionType'],"heat_type ".$_POST['heatType'],"lift_type ".$_POST['liftType'],"parking_type ".$_POST['parkingType']);
$user=$_SESSION["user"];
$whois = $mysqli->query('SELECT * FROM users WHERE uid='.$mysqli->real_escape_string($user).' ');
$who = $whois->fetch_assoc();
switch($who['user_title']){
 case '0':
 $res=$mysqli->query('SELECT * FROM searches WHERE uid='.$mysqli->real_escape_string($user).' 
 ORDER BY '.$mysqli->real_escape_string($ordering[0]).',
 '.$mysqli->real_escape_string($ordering[1]).',
 '.$mysqli->real_escape_string($ordering[2]).',
 '.$mysqli->real_escape_string($ordering[3]).',
 '.$mysqli->real_escape_string($ordering[4]).',
 '.$mysqli->real_escape_string($ordering[5]).',
 '.$mysqli->real_escape_string($ordering[6]).',
 '.$mysqli->real_escape_string($ordering[7]).',
 '.$mysqli->real_escape_string($ordering[8]).',
 '.$mysqli->real_escape_string($ordering[9]).',
 '.$mysqli->real_escape_string($ordering[10]).',
 '.$mysqli->real_escape_string($ordering[11]).'
 ') or die($mysqli->error);
 while($ki=$res->fetch_assoc()){
 $tomb[] = $ki;
 }
 $tomb = array("query-data"=>$tomb);
 echo json_encode($tomb);

can anybody help to me to write these values to a table?

• Cjxcz Odjcayrwl: And what have you tried?
• Barmar: It's just an ordinary Javascript object, you can access it with json['query-data']. This is an array you can iterate over.
• bystwn22: Just an advice, pass an extra argument to $.post as json so you dont need to use $.parseJSON. ie: $.post(url,params,callback,'json')

Answer 1

You can do something like this.

UPDATED:

$.post( 'loader.php', getGetStr(), function( data ) {
 if ( !data || !data['query-data'] ) {
 // invalid json string, so dont process
 return;
 }
 data = data['query-data'];
 // create the table
 var table = $("<table />").html('<thead></thead><tbody></tbody>');
 // inserted table head cols?
 var thead = false;
 // loop through 'query-data'
 for( i = 0; i < data.length; i++ ) {
 // append 'tr' element to 'tbody'
 var tr1 = $("<tr />").appendTo( table.find("tbody") );
 if ( !thead ) {
 // if not finished creating table head cols, then append 'tr' elemnts to thead
 var tr2 = $("<tr />").appendTo( table.find("thead") );
 }
 // loop if its an object
 if ( typeof data[i] === "object" ) {
 for( j in data[i] ) {
 if ( !thead ) {
 // if not finished creating table head cols, then append 'th' elements to thead
 $("<th />").html( j ).appendTo( tr2 );
 }
 // insert our real dat to table rows
 $("<td />").html( data[i][j] ).appendTo( tr1 );
 }
 // we finished creating table head cols
 thead = true;
 }
 }
 // append the table to whatever element you want,
 // you can also use $("body").html( table );
 table.appendTo( $("body") );
}, "json" );

• Allili Omár: But how can I write to table from these query??
• holographic-principle: Don't use for .. in to iterate over an array.

Answer 2

You can loop through an object like this:

without inherited properties from it's prototype

for( i in json ) {
 if ( json.hasOwnProperty( i ) ) {
 console.log( i, json[ i ] );
 }
}

with inherited properties from it's prototype

for( i in json ) {
 console.log( i, json[ i ] );
}

i is the key and json[ i ] is the value.

• Allili Omár: but the output dosen't different. how can I get the values like key, value ?

Answer 3

Try to iterate query-data using console.log(json.query-data[0]); or foreach;

Write a dynamic html table to display.

Answer 4

Here is the principle for printing a table

function printRow(item){
 var html = "<tr>";
 for(var key in item){
 html += "<td>"+key+"</td><td>"+item[key]+"</td">;
 }
 html += "</tr>";
 return html;
}
$.post('loader.php',getGetStr(),function(data){
 var json = $.parseJSON(data);
 console.log(json);
 for(var key in json['query-data']){
 var item = json['query-data'][key];
 var html = "<table>";
 html += printRow(item);
 html += "</table>";
 }
});