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

JavaScript
1

Tell us what’s happening:

For this project, my plan is to first make it so that the output is the same as the number input, and then use the replace() function in some way to change the number inputs to roman numerals. Thoughts on if this is a good idea?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
<input id="number" type="number"></input>
<button id="convert-btn">Convert</button>
<div id="output"></div>
<script src="script.js"></script>
</body>
</html>

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

const inputFunc = () => {
  if (input.value === "") {
    output.innerText = "Please enter a valid number";
  } else if (input.value === "-1") {
    output.innerText = "Please enter a number greater than or equal to 1";
  } else if (input.value >= "4000") {
    output.innerText = "Please enter a number less than or equal to 3999";
  } else {
    output.innerText === input.value;
  }
} 

convertBtn.addEventListener("click", inputFunc);


/* file: styles.css */

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.3 Safari/605.1.15

Challenge Information:

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

2

Hi there. Validate the input to ensure the number is between 1 and 3999, converting it using parseInt() for accurate comparisons. Handle invalid inputs by showing appropriate messages. Fix the output logic by replacing output.innerText === input.value with output.innerText = input.value. Use a function (toRoman) that maps numbers to Roman numeral equivalents with an array of values and symbols. Subtract the value from the number and append the numeral until the number is reduced to 0. This ensures valid input is converted to Roman numerals and displayed correctly. Example: Input 1987 outputs MCMLXXXVII.

3

I changed the output logic and for some reason the output.innerText only equals the input for some numbers but not others. For instance, if I enter numbers 1-4 into the input, it shows 1-4 in the output. But if I put 5, it gives me the “Please enter a number less than or equal to 3999” message. But if I put in 10, it shows 10 in the output. I don’t understand what could explain this.

4

show your code, you are asking us to guess

5

It’s up above. I haven’t started on the Roman Numeral part.

6

This has been fixed. I just needed parseInt()

7

you said you changed it

8

I don’t know what you mean by this.