Build a Roman Numeral Converter Project - Build a Roman Numeral Converter

JavaScript
1

Tell us what’s happening:

my code meets all the conditions of the test but it doesn’t pass them. example when 649 is inputted the output is DCXLIX. which is the condition to pass the test but it dosnt. I have already checked all the id names to ensure they are correct

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, intial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <input id='number'>
    <button id='convert-btn'></button>
    <div id='output'></div>
    

    <script src='script.js'></script>
  </body>
</html>

/* file: styles.css */




/* file: script.js */
const numberInput = document.getElementById('number');
const convertBtn = document.getElementById('convert-btn');
const output = document.getElementById('output');

let msg = ''



const numerals = 
[
  {
    romainNumerals: ['M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I'],
    arabicNumerals: [1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1]
  }
]

function alertInput()
{
  if (numberInput.value === '')
      {
        msg = "Please enter a valid number"
      }
    else if (numberInput.value < 0)
    {
     msg = "Please enter a number greater than or equal to 1"
    }
    else if (numberInput.value >= 4000)
    {
      msg = "Please enter a number less than or equal to 3999"
    }

    if (msg)
    {
      output.innerHTML = msg;
      setTimeout(() => {output.innerHTML = ''}, 3000);
      return false;
    }

    return true;
}

function converter ()
{
  let result = '';
  let input = parseInt(numberInput.value, 10);

  const {romainNumerals, arabicNumerals} = numerals[0];


  for (let i = 0; i < arabicNumerals.length; i++)
  {
    while (input >= arabicNumerals[i])
    {
      result += romainNumerals[i];
      input -= arabicNumerals[i];
    }
  }

  output.innerHTML = result;
}

convertBtn.addEventListener('click', () => 
{
  if (alertInput())
  {
    converter();
  }
  
})

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.0 Safari/605.1.15

Challenge Information:

Build a Roman Numeral Converter Project - Build a Roman Numeral Converter

2

Hi there!

That variable should be declared and assigned within the required function .

1 Like
3

thanks! can you please explain why that is the problem ?

4

Because the tests run in a script one after the other and do not reload the page in between. Any code in the global scope will only run once at the start and never again.

1 Like