Build a Palindrome Checker Project - Build a Palindrome Checker

JavaScript
1

Tell us what’s happening:

[TypeError: Cannot read properties of undefined (reading ‘trim’)]

I keep getting this error message when I try to run my code, can someone help me figure out what I’m doing wrong? :frowning:

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Palindrome Checker</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <script src="index.js"></script>
    <h1>Palindrome Checker :]</h1>
    <input id="text-input"/>
    <button id="check-btn">Check</button>
    <div id="result"></div>
  </body>


/* file: script.js */
const userInput = document.getElementById("text-input");
const checkPalindromeBtn = document.getElementById("check-btn");
const resultDiv = document.getElementById("result");

const checkForPalindrome = input => {
  const originalInput = input;
  if (input === '') {
    alert('Please input a value');
    return;
  }


  const lowercaseString = input.replace(/[^A-Za-z0-9]/gi, '').toLowerCase();
  let resultMsg = `${originalInput} ${lowercaseString === [...lowercaseString].reverse().join('') ? 'is' : 'is not'} a palindrome.`;

  result.innerText = resultMsg;
};

checkPalindromeBtn.addEventListener('click', () => {
  checkForPalindrome(userInput.value);
  userInput.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/128.0.0.0 Safari/537.36 OPR/114.0.0.0

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

2

Hello there!

I did not encounter this error while performing some tests on your code.

3

For some reason reloading removed the error but now it seems to not process my clicking the button at all, I didn’t change any of the code seen here

4

Try clearing caches or use a different browser.

5

looking at your code I see an issue here. What is result?

2 Likes
6

that was for sure an error I missed, I replaced it with

resultDiv.innerText = resultMsg;

but my problem seems to be with my button, I have multiple console logs that should go off on clicks so even if there was a function error I should theoretically be seeing those, but clicking my button seems to not even register :sob:

7

oh, right, fix the name and put it just before </body>

1 Like