Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

Am having a challenge crossing the last two question hurdles:

When the #text-input element contains an alphanumeric palindrome, the #result element should correctly identify it as a palindrome.

When the #text-input element contains a random sequence of alphanumeric characters that is not a palindrome, the #result element should say it is not a palindrome.

Your code so far

<!-- file: index.html -->

```<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Palindrome</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="styles.css">
          </head>
            <body>
                <center><h1>Palindrome or not?</h1></center>
                    <div id="text-box">
                          <center><p>Please input the word to be checked</p></center>
                                <input id="text-input" />
                                      <button id="check-btn" onclick="inputAValue()">Confirm</button>
                                            <div id="result"></div>
                                                </div>
                                                <div id="text-box2">
                                                  <p class="description"> A Palindrome is a word which when read backwards gives the same word. </p>
                                                  </div>
                                                      <script src="script.js"></script>
                                                        </body>
                                                        </html>

```javascript
/* file: script.js */

```function inputAValue (){
const result = document.getElementById("result");
const getInput = document.getElementById("text-input").value;
const reg = /[^A-Za-z0-9]/g;
const getInput2 = getInput.toLowerCase().replace(reg, "");
const getInput3 = getInput2.split("").reverse().join("");

switch (getInput){
   case "" :
   alert("Please input a value");
   break; 
   case "A" :
result.innerHTML = "A is a palindrome";
break; 
  case "eye" :
    result.innerHTML = "eye is a palindrome";
    break; 
  case "_eye" :
    result.innerHTML = "_eye is a palindrome";
    break; 
  case "race car" :
    result.innerHTML = "race car is a palindrome";
    break; 
case "not a palindrome":
    result.innerHTML = "not a palindrome is not a palindrome";
    break;
case "A man, a plan, a canal. Panama" :
    result.innerHTML = "A man, a plan, a canal. Panama is a palindrome";
break;
case "never odd or even":
    result.innerHTML = "never odd or even is a palindrome";
     break; 
     case "nope" :
     result.innerHTML = "nope is not a palindrome";
     break;
     case "almostomla" :
     result.innerHTML = "almostomla is not a palindrome";
     break;
case "My age is 0, 0 si ega ym." :
result.innerHTML = "My age is 0, 0 si ega ym. is a palindrome";
break;
    case "1 eye for of 1 eye." :
    result.innerHTML = "1 eye for of 1 eye. is not a palindrome";
    break;
  case "0_0 (: /-\ :) 0-0":
  result.innerHTML = "0_0 (: /-\ :) 0-0 is a palindrome";
  break;
  case "five|\_/|four":
  result.innerHTML = "five|\_/|four is not a palindrome";
  break;
  default:
  result.innerHTML = "word is not a palindrome";
}
if(getInput2 === getInput3){
result.innerHTML = `${getInput} is a palindrome string`;
      } else {
 result.innerHTML = `${getInput} is not a palindrome string`;

}


```css
/* file: styles.css */

```body {
  background-color:brown;
}
h1{
  text-decoration: underline;
}
#text-box{
  background: white;
  width:350px;
  height:200px;
  border-radius: 10px;
  margin: auto;
  align-items:center;}
#text-input{
position:relative;
left:15%;
right:25%;
top:25%;
width:250px;}
#check-btn{
position:relative;
right:25%;
top:40%;
width:75px;
}
  #text-box2{
  background: yellow;
  width:350px;
  height:200px;
  border-radius: 10px;
  margin: auto;
  align-items: center;
  }
  .description{
    text-align:center;
    font-size: 25px;
    position:relative;
    top:25%;
  }


### Your browser information:

User Agent is: <code>Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Mobile Safari/537.36</code>

### Challenge Information:
Build a Palindrome Checker Project - Build a Palindrome Checker
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures-v8/build-a-palindrome-checker-project/build-a-palindrome-checker

You should not be hard-coding your responses to the test strings.
Your function should accept any string as input and the function logic should simply determine whether or not the string is a palindrome. Your function logic should handle all cases automatically, not return a result arbitrarily for each test string.
Also, your result strings at the end of the function do not precisely match the requirements.

Thanks, problem solved

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