How to populate list items with ajax?

#1

I see how to use ajax as a data source after the user starts typing, but I’m wondering if anyone has any tips on how to populate the options themselves with Ajax.

More details: after my page loads I’m loading some JSON with Ajax to populate a Google Map, and while it’s initing the map I’d also like to use that data to populate the options in my select2 select widget. No Ajax processing required after that, just for the initial list propagation.

Something like this (psuedocode) that runs when the page loads:

<script>

	$.getJSON(
		"my_data.json",

		function(data) { 

			// populate my google map


			// populate my select2 choices

	}

</script>



<select class="js-example-basic-multiple" name="states[]" multiple="multiple">
 <!-- these options should get populated from ajax -->
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>