Question

Despite other similar examples, I cannot quite get this each loop to work to populate a selectlist…but I’m really close!

Per my previous question, I am returning a json array using a PHP script, based on another question that got partially answered. The script, getStudyNames.php, returns this json array:

[{"studyindex":"1","studyname":"ADHD"},{"studyindex":"24","studyname":"ADHD_RD"},{"studyindex":"20","studyname":"AFL"},{"studyindex":"42","studyname":"AFRICANERS"},{"studyindex":"2","studyname":"AHD"},{"studyindex":"22","studyname":"AJS"},{"studyindex":"3","studyname":"ASA-FS"},{"studyindex":"4","studyname":"ASIAN"},{"studyindex":"5","studyname":"AUS TWINS"},...]

However, I cannot quite seem to get the syntax correct on how to parse this array, then add it to a selectionlist.

Here is my code that attempts to do this:

$.ajax({                                      
      url: 'getStudyNames.php',        //the script to call to get data          
      data: "",                        //you can insert url argumnets here to pass to api.php
                                       //for example "id=5&parent=6"
      dataType: 'json',                //data format
      error: function() {
        alert('Refresh of study names failed.');
      },
      success: function(data)          //on receipt of reply
      { 
        var $studylist = $('#studylist').empty();
        $data.each(data, function(i, record) {
          $studylist.append('<option value='.record.studyindex.'>'.html(record.studyname) );
        })
       } 
    });

I know that getStudyNames.php works, per the output above; but why this studylist is NOT working is still a mystery to me…appreciate any help!

Answer 1

Try by putting following in success.

var $studylist = $('#studylist').empty();
$.each(data, function(i, record) {
   $studylist.append($("<option/>", {
        value: record.studyindex,
        text: record.studyname
    }));
});