Having trouble to load data from JSON

How Do I...
#1

Hi everyone, I’m new to JS and JSON. What I want to do is get a list of country names from a URL then load that list as the options for Select2. This is the url that I used to get country names. https://corona.lmao.ninja/countries. I did some parsing and formatting to create the following array to be used for Select2. https://pastebin.pl/view/caede535. However when I do

$(".js-example-data-array").select2({
  data: ARRAY
})

The country names don’t show up as the options for Select2. I’m not sure what I did wrong. Can someone help me fix this?

#2

For starters, Select2 does not allow an ID value of 0. So try bumping all your IDs up by 1 (so USA has id: 1) and see if that solves your problem.

#3

I tried, it didn’t work. So right now, I just created an array of the countries myself, instead of pulling data from the API.

#4

I guess I don’t understand what you mean by “pulling data from the API”.

It sounds like you just need to get the country data one time (when your application starts) and then pass that to your Select2. In that case you can use jQuery’s json() method to retrieve the country data from the API, then convert it into the Select2 data format and store it in a variable that you then pass to the Select2’s initialization method (in the “data” configuration property).

#5

Actually, I see what’s wrong with the data format you created (in your pastebin). Instead of passing an array of items to the data configuration property, you must pass an object that contains the items array in a property called “results” (that object can optionally contain other properties for other features, such as pagination, but it must at least contain the “results” property). Look carefully at the Select2 data format documentation and compare the example there to what you have in your pastebin.