Complex JSON into HTML table using Javascript

Question

var resData = {"request" : { "empid(Number)":"employeeid(Number)" , "msisdn(Number)":"empmsisdn(Number)" , "num(String)":"number(String)" , "add(String)":"address(String)" } , " response" : {"empid(Number)":"employeeid(Number)" , "msisdn(Number)":"empmsisdn(Number)" , "num(String)":"number(String)" , "add(String)":"address(String)" } }

Normal JSON key value was converted into table but using this I want to create two table as key value pairs and heading of them as request and response resp using JavaScript.

Answer 1

I have not created the UI, just written the logic to print 'n' number of complex objects with table name check snippet in console.

 var resData = {"request" : { "empid(Number)":"employeeid(Number)" , "msisdn(Number)":"empmsisdn(Number)" , "num(String)":"number(String)" , "add(String)":"address(String)" } , " response" : {"empid(Number)":"employeeid(Number)" , "msisdn(Number)":"empmsisdn(Number)" , "num(String)":"number(String)" , "add(String)":"address(String)" } };

var keys = Object.keys(resData);
recursiveCall(keys,"tableVal",resData);

function recursiveCall(keys,tableName,objectData){
	for(var i=0;i<keys.length;i++){
      var values = objectData[keys[i]];
    if(typeof values==="object" || values instanceof Object){
         var newkey = Object.keys(values)	       
        recursiveCall(newkey,keys[i],values);
    }else{  
     if(i==0){
        //create new Table
        console.log("tableName: "+tableName);
     }  
     	console.log("new row:   key:"+keys[i]+", value:"+objectData[keys[i]]);
    }
	}
}