Build a Recipe Ingredient Converter - Step 18

JavaScript
1

Tell us what’s happening:

Hello, guys. I keep getting this error! 1. When clicking the button your

updateResultsList
function should properly update the DOM.

const updateResultsList = () => {
  resultList.innerHTML = "";
  let value;
  let ingredient= unitToConvert.value;
  units.forEach((unit)=>{if(unitToConvert.value!== unit)
  {value= convertQuantity(unitToConvert.value)(unit)(ingredientQuantity.value)
  console.log(value);
  const li= document.createElement("li");
  li.textContent=`${unitToConvert.value}: ${value} ${unit}`;
  resultList.appendChild(li)
  }
  })

}

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */
// User Editable Region

const adjustForServings = (baseQuantity) => (newServings) =>
  (baseQuantity / 1) * newServings;

const servingsResult = adjustForServings(4)(6);
console.log(servingsResult);

const processIngredient = (baseQuantity, baseUnit, newUnit, newServings) => {
  const adjustedQuantity = adjustForServings(baseQuantity)(newServings);
  const convertedQuantity =
    convertQuantity(baseUnit)(newUnit)(adjustedQuantity);
  return convertedQuantity.toFixed(2);
};

const ingredientName = document.getElementById("ingredient");
const ingredientQuantity = document.getElementById("quantity");
const unitToConvert = document.getElementById("unit");
const numberOfServings = document.getElementById("servings");
const recipeForm = document.getElementById("recipe-form");
const resultList = document.getElementById("result-list");

const units = ["cup", "gram", "ounce", "teaspoon"];

const updateResultsList = () => {
  resultList.innerHTML = "";
  let value;
  let ingredient= unitToConvert.value;
  units.forEach((unit)=>{if(unitToConvert.value!== unit)
  {value= convertQuantity(unitToConvert.value)(unit)(ingredientQuantity.value)
  console.log(value);
  const li= document.createElement("li");
  li.textContent=`${unitToConvert.value}: ${value} ${unit}`;
  resultList.appendChild(li)
  }
  })

}


recipeForm.addEventListener("submit", (event) => {
  event.preventDefault();
  updateResultsList();
});

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36

Challenge Information:

Build a Recipe Ingredient Converter - Step 18

2

I tried this ..

const li= document.createElement("li");
  li.textContent=`${ingredientName.value}: ${(value).toFixed(2)} ${unit}`;
3

The function you are using is used inside another function, which is the function you should be using.

1 Like
4

I didn’t get the point. Which function are you referring to?

5

Is there a better function you can call to return a converted quantity?

You can test your result in the preview window using the example and comparing to its expected result.

6

thank you so much. Problem is solved