0

So we are using CocktailDB for our API key in the bootcamp that i am in and its working but on the page that displays our Ingredients and Directions on how to make the cocktail it wont display. Here is our function in JavaScript, any answers or solutions would be greatly appreciated.

function displayIng(id){
    ingPg.style.display = "block";
    listPg.style.display = "none";

    searchIng(id);
    
    //search for ingredients and directions with id
    var ingredients = [resultsIng.drinks[0].strIngredient1, resultsIng.drinks[0].strIngredient2, resultsIng.drinks[0].strIngredient3, resultsIng.drinks[0].strIngredient4, resultsIng.drinks[0].strIngredient5,
    resultsIng.drinks[0].strIngredient6, resultsIng.drinks[0].strIngredient7, resultsIng.drinks[0].strIngredient8, resultsIng.drinks[0].strIngredient9, resultsIng.drinks[0].strIngredient10, 
    resultsIng.drinks[0].strIngredient11, resultsIng.drinks[0].strIngredient12, resultsIng.drinks[0].strIngredient13, resultsIng.drinks[0].strIngredient14, resultsIng.drinks[0].strIngredient15];
    
     console.log(ingredients);

    var dir = resultsIng.drinks[0].strInstructions; 
    var directions = dir.split(".");

    for(var i = 0; i < ingredients.length; i++){
        var list = document.createElement("li");
        list.textContent = ingredients[i];
        loi.appendChild(list);
    }
    for(var i = 0; i < directions.length; i++){
        var list = document.createElement("li");
        list.textContent = directions[i];
        dir.appendChild(list);
    }

    enjoyBtn.onclick = function(event){
        displayMusic();
    };
}
Barmar
  • 741,623
  • 53
  • 500
  • 612
Parzival
  • 1
  • 1
  • Try to show a more finished example. Because we don't know what `resultsIng` is. Maybe you got an error from that array. – jics Mar 31 '21 at 23:29
  • What does `searchIng(id)` do? I suspect it's asynchronous, and you're not waiting for it to finish. – Barmar Mar 31 '21 at 23:29
  • See [How to return the response from an asynchronous call](https://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) – Barmar Mar 31 '21 at 23:31

0 Answers0