Learn Form Validation by Building a Calorie Counter - Step 57

Tell us what’s happening:

The NodeList values you will pass to list will consist of input elements. So you will want to look at the value attribute of each element.

Assign the value of the element in list at index i to a variable called currVal.

### Your code so far

function getCaloriesFromInputs(list) {
  let calories = 0;
  let currVal = '';
  for (let i = 0; i < list.length; i++) {
    currVal = list[i];
  }
}

I’ve also tried:

currVal = list.value(i);
currVal = list[i].value;
currVal = list.value([i]);

Thanks in advance!

1 Like

please provide the link to the step

1 Like

these are all syntax errors, not correct JavaScript. If you provide the link to the step we can see what’s going on

Oh apologies i didn’t mean i actually had those floating in my code. I was just listing my other attempts.

const calorieCounter = document.getElementById('calorie-counter');
const budgetNumberInput = document.getElementById('budget');
const entryDropdown = document.getElementById('entry-dropdown');
const addEntryButton = document.getElementById('add-entry');
const clearButton = document.getElementById('clear');
const output = document.getElementById('output');
let isError = false;

function cleanInputString(str) {
  const regex = /[+-\s]/g;
  return str.replace(regex, '');
}

function isInvalidInput(str) {
  const regex = /\d+e\d+/i;
  return str.match(regex);
}

function addEntry() {
  const targetInputContainer = document.querySelector(`#${entryDropdown.value} .input-container`);
  const entryNumber = targetInputContainer.querySelectorAll('input[type="text"]').length + 1;
  const HTMLString = `
  <label for="${entryDropdown.value}-${entryNumber}-name">Entry ${entryNumber} Name</label>
  <input type="text" id="${entryDropdown.value}-${entryNumber}-name" placeholder="Name" />
  <label for="${entryDropdown.value}-${entryNumber}-calories">Entry ${entryNumber} Calories</label>
  <input
    type="number"
    min="0"
    id="${entryDropdown.value}-${entryNumber}-calories"
    placeholder="Calories"
  />`;
  targetInputContainer.insertAdjacentHTML('beforeend', HTMLString);
}

function getCaloriesFromInputs(list) {
  let calories = 0;
  let currVal = '';
  for (let i = 0; i < list.length; i++) {
    currVal = list[i];
  }
}

addEntryButton.addEventListener("click", addEntry);

link to the step please

Sorry I’m not understanding. What do you mean by link?

the link or url of the step you are doing, that’s why you don’t delete all the content of the prefilled post, because it includes also that

Ohh okay gotcha.

ok, you need to create currValue inside the loop.

also this is the way to get the value of the html node, sorry about before, it wasn’t clear that list was a list of html nodes

3 Likes

Ah okay! Thank you for the help and advice.

I’ll also be sure to follow and include the pre-filled post next time!

1 Like

got it
MOD EDIT SOLUTION REMOVED

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.