Palindrome checker requirements

I have completely completed the palindrome checker and it’ll pass all the requirements but the system is not picking up on anything past the first 4

Please post your code so we can help. This usually is because of global variable misuse in my experience.

// Global variables
const button = document.getElementById('check-btn');
const userInput = document.getElementById('text-input');
const response = document.getElementById('result');

// Function to check if a string is a palindrome
const isPalindrome = (input) => {
  // Remove all non-alphanumeric characters and convert to lowercase
  const cleanedInput = input.replace(/[^A-Za-z0-9]/g, '').toLowerCase();
  
  // Reverse the cleaned string
  const reversedInput = cleanedInput.split('').reverse().join('');
  
  // Check if cleaned input matches the reversed input
  return cleanedInput === reversedInput;
}

// Function to handle button click
const checkIfPalindrome = () => {
  const originalInput = userInput.value;
  
  // Check if the input is empty
  if (!originalInput.trim()) {
    window.alert("Please input a value");
    return;
  }

  // Determine if the input is a palindrome and display original input in the result
  if (isPalindrome(originalInput)) {
    response.innerHTML = `"${originalInput}" is a palindrome`;
  } else {
    response.innerHTML = `"${originalInput}" is not a palindrome`;
  }
}

// Add event listener to the button
button.addEventListener('click', checkIfPalindrome);

I do it in vs studio beforehand and it always give me issues converting it over

And what is your HTML?

type or p<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Palindrome Checker</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <main>
      <section id="inputSection">
        <h1>Palindrome Checker</h1>
        <input id="text-input" type="text" placeholder="Enter text" required>
        <button id="check-btn">Check</button>
      </section>
      <section>
        <p id="result"></p>
      </section>
    </main>
    <script src="script.js"></script>
  </body>
</html>
paste code here

These don’t match exactly, precisely, character for character the requested output. You have 2 extra characters.

I see now I had put quotes around the user input

1 Like