Trying to parse JSON response data from public API

Question

Having trouble rendering JSON data to a selectbox from my clients public job board API.

This is what I have so far:

Javascript:

$(document).ready(function(){
$.ajax({
    url:'https://api.greenhouse.io/v1/boards/roivantsciences/jobs/',
    type:'POST',
    data: 'q=' + str,
    dataType: 'json',
    success: function( json ) {
        $.each(json, function(i, value) {
            $('#myselect').append($('<option>').text(value).attr('value', value));
        });
    }
});
});

HTML:

<select id="myselect" name="myselect" ><option selected="selected">blank</option></select>

it's not returning anything. i'm sure this is rife with mistakes but any amount of guidance would be greatly appreciated

Answer 1

You are almost there, but please check whether you are using the correct HTTP method. I assume it should be a GET call rather than a POST call.

$(document).ready(function(){
$.ajax({
    url:'https://api.greenhouse.io/v1/boards/roivantsciences/jobs/',
    type:'GET',
    data: 'q=' + str,
    dataType: 'json',
    success: function( json ) {
        $.each(json.jobs, function(i, value) {
            $('#myselect').append($('<option>').text(value.title).attr('value', value.title));
        });
    }
});
});

Please check my JSBin sample and let me know how it goes.

PS - I used the title attribute to bind it to the select box just to demonstrate it to you. You can change it as you wish