JSON data from google spreadsheet

Question

I went through this fiddle which have a sample of three dropdown with json data. I have a sample google spreadsheet here. Now is it possible to render this spreadsheet data to the example given at fiddle as json format. I know we can convert the spreadsheet to json as,

 var query = new google.visualization.Query('http://spreadsheets.google.com/tq?key=0AozvCNI02VmpdDkwR3RETmczbTI4ZFJhTXJkZHlUbEE#gid=0');
 query.send(handleQueryResponse);
 }
 function handleQueryResponse(response) {
    data = response.getDataTable();
    }

But using this the dropdown didn't works.

dev · Accepted Answer · 2014-03-05T19:01:02.877

14

I'm not sure about the way you're doing it but it can be accomplished a different way. Please see this fiddle using your example data, and below for the code.

Basically you call the JSON data from your spreadsheet with the below HTML script tags.

<script src="http://spreadsheets.google.com/feeds/list/0An1-zUNFyMVLdEFEdVV3N2h1SUJOdTdKQXBfbGpNTGc/1/public/values?alt=json-in-script&amp;callback=importGSS"></script>

Please note I'm linking to a copy of your spreadsheet as it requires it to by published

Then the you can handle the data with the below script.

function importGSS(json){
    for(var i = 0; i < json.feed.entry.length; i++){
        var entry = json.feed.entry[i];
        $('#departments').append('<option>' + entry.gsx$subdivision.$t + '</option>');
        $('#subject').append('<option>' + entry.gsx$section.$t + '</option>');
        $('#services').append('<option>' + entry.gsx$station.$t + '</option>');
    }
}

You can obviously adapt to your own needs.

edited Mar 05 '14 at 19:01

answered Apr 27 '13 at 21:38

dev

3,969
3
24
36

I require something similar. But also want iterlinking and unique values in dropdown. – mpsbhat Apr 29 '13 at 04:34
I'm afraid without a greater detail of description I can't picture what you're after. My code above is pretty simple so I hope it gets you on the right track to achieving your goal – dev Apr 29 '13 at 17:39
Please go trough [this sample](http://jsfiddle.net/NEyEh/) in which when selecting IT in 1st dropdown it shows its child in 2nd dropdown. Similarly, when selecting accounting, it shows its children and so on. But in that sample the data is hard coded json. But is it possible to create the same type of dropdown from Google spreadsheet data? – mpsbhat Apr 30 '13 at 05:00
1

I see what you mean but I haven't got the time to write the exact code you need. To get what you want, I would do this by appending your first drop down options only if it doesn't already exist. Then appending the second drop down options with a class of the associated first drop down and like wise with the third options having a class of the associated second drop down option. Then set all the options in the second and third drop downs to be hidden. Then when an option is selected, those with the class of that option are then set to be visible. Hope that helps. – dev Apr 30 '13 at 17:46

JSON data from google spreadsheet

1 Answers1

Linked