python - Rows and Columns HTML TABLE (JSON RESPONSE) -

i have following code in index.html grabs dictionary list , prints out keys , values table

$(function() {   $('a#search').bind('click', function() {     $.getjson('/_search', {       a: $('input[name="a"]').val()     }, function(data) {       var tabledata = '<table>'       $.each(data.result, function(key, value){         tabledata += '<tr><td>' + '   ' + key + '   ' + '</td>';         alert(key)         $.each(value, function(val){             alert(value[val])             tabledata += '<td>' + value[val] + '</td>';           });         tabledata += '</tr>';       });       tabledata += '</table>';       $('#table').html(tabledata);     }); 

what grabbing dictionary list search.py

result = defaultdict(list) return jsonify(result=result) 

result contains following

defaultdict(<class 'list'>, {'developer': ['office koukan', 'jorudan', 'beam software'], 'publisher': ['shouei', 'vap', 'hi tech expressions'], 'releasedate': ['march 18, 1994', 'november 18, 1994', 'october 1, 1993'], 'title': ['idea no hi', 'pachinko hi hisshouhou', 'hunthe hunt red october']}) 

however output follows

developer publisher releasedate title office    koukan    jorudan beam software shouei    vap       hi tech expressions march 18, 1994  november 18, 1994   october 1, 1993 idea no hi  pachinko hi hisshouhou  hunthe hunt red october 

when output should be

developer      publisher releasedate title office         shouei    ...         ... koukan         vap       ...         ... jorudan        ...       ...         ... beam software  ...       ...         ... 

any idea might doing wrong appreciated?

because of way json formatted need use multiple loops. if have control on formatting simpler loop though if formatted follows :-

{   "objects" : [   {     "developer": "office koukan",     "publisher": "shouei",     "releasedate": "march 18, 1994",     "title": "idea no hi"   },   {     "developer": "jorudan",     "publisher": "vap",     "releasedate": "november 18, 1994",     "title": "pachinko hi hisshouhou"   },   {     "developer": "beam software",     "publisher": "hi tech expressions",     "releasedate": "october 1, 1993",     "title": "hunthe hunt red october"   } ] } 

this provide more natural loop can loop through each object instead of looping on each field grouping multiple times.

if can't change format, @ jsfiddle http://jsfiddle.net/8tt4p/3538/.

i created js array match data. ive looped through once table header row setup. there's triple nested loop create row each record, pull out correct data row/column.

hope helps in way