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

JavaScript
1

Tell us what’s happening:

I’m done with all the script and html code and i’ve linked the script to the html body element but for some reason it’s not accepting the code can someone check if i linked it properly or the problem lies somewhere else. Please any hint will be much appreciated

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="styles.css" />
    <link rel="scriptsheet" href="./script.js" />
<title>Roman Numeral Converter</title>
  </head>
  <body>
<label for="number">Enter Numbers: </label>
<input id="number"></input>
<button id="convert-btn">convert</button>
<div id="output"></div>
<script src="./script.js"></script>
  </body>
</html>

/* file: styles.css */


/* file: script.js */
document.getElementById('convert-btn').addEventListener('click', () => {
  const inputNumber = parseInt(document.getElementById('number').value)
  if (isNaN(inputNumber) || inputNumber < 1) {
    document.getElementById('ouput').textContent = "Please enter a valid number"
  } else if (inputNumber < 1) {
    document.getElementById('ouput').textContent = "Please enter a number greater than or equal to 1"
  } else if (inputNumber >= 4000) {
    document.getElementById('ouput').textContent = "Please enter a number less than or equal to 3999"
  } else {
    const romanNumerals = convertToRoman(inputNumber);
        document.getElementById('output').textContent = romanNumerals;
  }
});

function convertToRoman (num) {
   const romanNumeral = '';
   const romanNumeralMapping = [
        { value: 1000, numeral: 'M' },
        { value: 900, numeral: 'CM' },
        { value: 500, numeral: 'D' },
        { value: 400, numeral: 'CD' },
        { value: 100, numeral: 'C' },
        { value: 90, numeral: 'XC' },
        { value: 50, numeral: 'L' },
        { value: 40, numeral: 'XL' },
        { value: 10, numeral: 'X' },
        { value: 9, numeral: 'IX' },
        { value: 5, numeral: 'V' },
        { value: 4, numeral: 'IV' },
        { value: 1, numeral: 'I' }
   ];
   for(let i=0; i < romanNumeralMapping.length; i++) {
     while (num >= romanNumeralMapping[i].value) {
    romanNumeral += romanNumeralMapping[i].numeral;
    num -= romanNumeralMapping[i].value;
   }
}
return romanNumeral;
}

Your browser information:

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

Challenge Information:

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

2

I’m able to paste your HTML and JS in there and run the tests. But not all of the tests are passing. Is this what you are referring to?

1 Like
3

well yes but i think the reason is because of my link the js to the html because i had a similar problem with the previous project so i just want to make sure thats not the problem before i start tampering with my js code since it looks more or less okay to me

4

and the test that aren’t passing are all the js related test which i don’t think is possible

5

Your script element is fine. The reason some of the tests aren’t passing is bugs in your code :slight_smile:

I’ll give you a hint to get you started:

document.getElementById('ouput').textContent

Are you sure you have the correct id?

2 Likes
6

Alright Thank you very much

7

Also.

const romanNumeral = '';
// ...code
romanNumeral += romanNumeralMapping[i].numeral;

romanNumeral is a const

When coding it is advisable to have the console open, or at least check it every so often.

1 Like
8

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.