Learn Form Validation by Building a Calorie Counter - Step 46

Tell us what’s happening:

Step 46
Inside your template literal, create a label element and give it the text Entry # Name. Using your template literal syntax, replace # with the value of entryNumber.

{entryDropdown.value} .input-container); const entryNumber = targetInputContainer.querySelectorAll('input[type="text"]').length; const HTMLString = Entry ${entryNumber} Name `;
}

I have done as instructed. But don’t know why it is not passing? Need help.

Your code so far

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

/* file: styles.css */

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

  const HTMLString = `<label>Entry ${entryNumber} Name </label>`;

// 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/128.0.0.0 Safari/537.36

Challenge Information:

Learn Form Validation by Building a Calorie Counter - Step 46

the code checker is being picky about a few things.
First you have an extra space after the word Name that you should erase.
Second, the original code was presented on 3 lines. You need to preserve that.
So click reset, then add the label element ONLY in the empty lines (the line above will contain the const declaration and the line below will contain the last backtick and semicolon)

1 Like

Hello hbar,
I have done suggested modification of my code. Still it is not working. The code after modification is as follows.

function addEntry() {
  const targetInputContainer = document.querySelector(`#${entryDropdown.value} .input-container`);
  const entryNumber = targetInputContainer.querySelectorAll('input[type="text"]').length;
  const HTMLString = `<label>Entry ${entryNumber} Name</label>
  `;
}

The error shown is : Sorry, your code does not pass. Try again.

You should have a label element inside your template literal.

the HTMLString needs to start by going to a new line, you deleted that

Please read my first post again.