Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

what am i doing wrong? it says if the text input its empty print an alert message which i did. so what exactly am i misisng here

Your code so far

<!-- file: index.html -->
<html>
<head>
<title>Palindrom Checker</title>
<script src="script.js"></script>
</head>
<body>
<input id="text-input">
<button id="check-btn"></button>
<p id="result"></p>
</body>
</html>

/* file: styles.css */

/* file: script.js */
document.getElementById("check-btn").addEventListener(click, () =>{
  const input = document.getElementById("text-input").value;
  if(input === ""){
    alert("Please input a value");
  }
})

Your browser information:

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

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

Where’s the rest of your HTML code? You seem to be missing most of the required HTML structure.

i have updated my html with the required sturcture but i still get an incorrect code. what else am i missing ?

Can you show me your updated HTML?

yes i just updated the original post

It might be the missing quotation within addEventListner.

.addEventListener("event", function)

this will pass it as a string

The method() was made to use strings for event types.

Thanks for bringing this to my notice but it still did not pass

<script src="script.js"></script>

I made the same mistake. Having this up top means that the HTML file has not been loaded. Java is unable to look for the id “check-btn”. Shift script to the bottom before the html closing tag.

For the rest of the code, I would try console-logging every step. For example, to assign a variable to the getElement method (refer to any previous lesson).

Add that to addEventListener, ensure that the button works before proceeding.

1 Like

You’ll need to share your updated code each time for us to look at it and give advice

this is my code.

document.getElementById("check-btn").addEventListener("click", () =>{
  const input = document.getElementById("text-input").value;
  if(input === ""){
    alert("Please input a value");
  }
  console.log(input);
})

and what is your html?


I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like

This is my HTML

<html>
<head>
<title>Palindrom Checker</title>
<script src="script.js"></script>
</head>
<body>
<input id="text-input">
<button id="check-btn">Submit</button>
<p id="result"></p>
<script src="script.js"></script>
</body>
</html>

i see my error now. i had two script tags on my JS file.

great you saw that! if you need more help please post your updated code in this topic

1 Like

i am trying to use an array to iterate and print out the palindrome words but i run into a road block. am i going about this the wrong way?

document.getElementById("check-btn").addEventListener("click", () =>{
  const input = document.getElementById("text-input").value;
  if(input === ""){
    alert("Please input a value");
  } else{
const palindromeList = ["A", "eye",
"_eye",
"race car",
"not a palindrome",
"A man, a plan, a canal. Panama",
"never odd or even",
"nope",
"almostomla",
"My age is 0, 0 si ega ym.",
"1 eye for of 1 eye.",
"0_0 (: /- :) 0-0",
"five|_/|four"];
input === palindromeList;
for (let i =0; i < palindromeList.length; i++){
result.innerHTML = palindromeList + "is a palindrome";
}
  }
  console.log(input);
})

It looks like you have hard-coded conditionals or variables that check for specific expected values. That is not solving this problem in the general case. Imagine if you were given different input values. Would your code be able to solve those problems?

To find out more about what hard-coding is or about why it is not suitable for solving coding questions, please read this post: Hard-coding For Beginners

Let us know if you have a question about how to make your code more flexible.

also this on a line of its own does nothing

so how do i properly do this. can you provide me a realistic solution ?