Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

Hello! May I ask for some help? I can’t figure out what is wrong with my code. I still get step 10( “A man, a plan, a canal. Panama is a palindrome”.) and step 14(My age is 0, 0 si ega ym. is a palindrome" .) wrong.

Your code so far

<!-- file: index.html -->
<body>
    <div class="container">
      <h1><span class="word tooltip">Palindrome</span> Checker</h1>
      
      <div class="palindrome-box">
        <label for="text-input">Enter in text to check for a palindrome:</label>
        <input id="text-input" class="box-input" value="" type="text"  />
        <button class="btn" id="check-btn" >
          <svg xmlns="http://www.w3.org/2000/svg" height="25px" viewBox="0 -960 960 960" width="25px" fill="#bac2c3"><path d="m358-488-97-96 42-42 54 54 100-100 42 42-141 142Zm426 368L532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg>
        </button>
        <div id="result" class="result hidden" ></div>
      </div>


    </div>
      


    <script src="script.js"></script>
  </body>
/* file: script.js */
const checkButton = document.getElementById("check-btn");
const userTextInput = document.getElementById("text-input");
const palindromeResult = document.getElementById("result");

const checkIfPalindrome = (input) =>{
  const userText = input;

  if(input === ""){
    alert("Please input a value");
    return;
  }

  palindromeResult.replaceChildren();
  
  let userInputRegEx = input.replace(/[^A-Za-z0-9]/gi, "");
  
  let resultNote =`${userText} ${userInputRegEx === [...userInputRegEx].reverse().join("") ? "is" : "is not"} a palindrome`;


  const p = document.createElement("p");
  p.innerText = resultNote;
  palindromeResult.appendChild(p);
}




checkButton.addEventListener("click", () => {
  checkIfPalindrome(userTextInput.value);
});
/* file: styles.css */

Your browser information:

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

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

Hi there!

Remove the i flag from regex pattern.

I did, but it didn’t change anything

Hi

You need to add the toLowerCase() method to your userInputRegEx variable value.

2 Likes

Thank you. Now it works. I am not sure I 100% understand but is that because the reversed sentences don’t match the original ones, like in “My age is 0, 0 si ega ym” the "ym "word doesn’t match “My” because it starts with the lower case?

Yes that’s it. You can see from your tests that it didn’t work for those ones until you did this. It’s also a requirement of the test to turn everything to lower or upper case.

1 Like