JsonToCsv

by seamuskc

HTML

<html>
  <body>
  <h3>
  Json To CSV POC
  </h3>
  <div>
  Enter Json
  </div>
  <textarea id="txtInput" rows=14 cols=70>
{
  "name": "James",
  "age": 21,
  "city" : "Torrington",
  "children": [{
    "name": "Jim",
    "age": 6,
    "children": [{
      "name": "Jimmy",
      "city" : "Huntington",
      "children": []
     }]
    }]
   } 
  </textarea>
  <div>
    <a id="doConvert" href="#" value="Go">Convert</a>
  </div>
  <div>
    Results:
  </div>
  <div>
    <textarea id="display" rows=14 cols=70>
    </textarea>
  </div>
  </body>
</html>

JavaScript

var getColumnNames = function (inputJson) {

	var colNames = [];
	for(var propertyName in inputJson) {
  		if (!Array.isArray(inputJson[propertyName])) {
      	colNames.push(propertyName);
      }
  }
  
  return colNames;
  
}

var buildRecord = function (inputJson, output, colNames) {

	if (!inputJson) {return;}
	
  var vals = []
  
  $.each(colNames, function(idx, colName) {
  	vals.push(inputJson[colName]);
 });

output.push(vals.join(","));
  
}

var walkChildren = function(inputJson, output, colNames) {

	if (!inputJson) {return;}
  
	for (var fieldName in inputJson) {
  	if (Array.isArray(inputJson[fieldName])) {
    	// For each array field ("children"), loop over/process children
      $.each(inputJson[fieldName], function(idx, child) {
          toCsv(child, output, colNames);
      });
    }
  }

}

var toCsv = function (inputJson, output, colNames) {

	if (!inputJson) {return;}
	
  buildRecord(inputJson, output, colNames);
  walkChildren(inputJson, output, colNames);
  
}

var doConvert = function() {

  var jsonText = $("#txtInput").val();
  var jsonObj = JSON.parse(jsonText);
  
  var output = []
  var colNames = getColumnNames(jsonObj);
  output.push(colNames.join(","));
  toCsv(jsonObj, output, colNames);
  $("#display").val(output.join("\n"));
  
} 

$(document).ready(function(){
 	$("#doConvert").click(doConvert);
});