CODEWITHSUNDEEP
javascripthtmlcssmenudropdown
Learn to Code
Learn to Code

Reputation: 93

How can I limit the number of options that show on my dropdown menu?

I'm trying to limit the number of options that these dropdown menus will show. Is there a way to do it?

 $.ajax({
    url: "https://free-nba.p.rapidapi.com/teams",
    method: "GET",
    dataType: "json",
    headers: {
    'X-RapidAPI-Key': "f8bbeecee3mshd11af53a602b7fcp133f59jsn3b4ffb3f20df",
    'X-RapidAPI-Host': "free-nba.p.rapidapi.com"}

  }).then( (response) => { 
    
    response.data.forEach ((teamObject) => {
      const teamName = teamObject.full_name;
      const teamID = teamObject.id;
      const htmlToAppend =
      `
      <option value="${teamName}">${teamName}</option>`
     
      $teamDropDown.append(htmlToAppend);
    });
  });
}
<select name="team" id="teamDropDown">
              <option value = " ">Select a team</option>
            </select>

these dropdown menus show but cant' seem to do it.

Upvotes: 0

Views: 84

Answers (1)

Konrad
Konrad

Reputation: 24681

// you can modify the number of elements here
response.data.slice(0, 10).forEach ((teamObject) => {
      const teamName = teamObject.full_name;
      const teamID = teamObject.id;
      const htmlToAppend =
      `
      <option value="${teamName}">${teamName}</option>`
     
      $teamDropDown.append(htmlToAppend);
    });

Upvotes: 1

Related Questions