# Palindrome Checker Project ignoring user input

**URL:** <https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725>\
**Category:** Curriculum Help\
**Tags:** javascript\
**Created:** [April 24, 2025, 1:51pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725 "2025-04-24T13:51:12Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 1:51pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/1 "2025-04-24T13:51:12Z")

</div>

I know the rules probably don’t allow help but I thought I would try, making sure to be limited in code shared and be vague. Particularly since there is chance they may be a problem may not come from me or be me not understand how the webpage works.

For clarity I have still got a long way to go to complete the project.

The problem seems to act the same whether I have pressed the check button or not or written text in the input box or not, program execution appears the same. For clarity I am not asking for help on interaction between these two. I included console.log() commands in program to help me understand it and whether changes are successful. I will reveal ‘console.log(textInput.value);’ outputs a blank line regardless. While ‘console.log(checkButton);’ outputs ‘{}’ regardless.

In the project there is a javaScript document call, button and input commands in the html part and html command calls in the javaScript part, among many other commands. I am being deliberately non-specific here.

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 2:51pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/2 "2025-04-24T14:51:28Z")

</div>

Please post your full code. It’s really not possible for us to give you much help without it.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:01pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/3 "2025-04-24T15:01:11Z")

</div>

I am happy to. Now I know for someone official and knowledgeable there is not a problem doing so.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:06pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/4 "2025-04-24T15:06:19Z")

</div>

HTML

```html
<!DOCTYPE html>
<html>
<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>
      <p>Enter text to see if it is a palindrome.</p>
      <input id="text-input">
     <button id="check-btn">
       Check
     </button>
     <div id="result"></div>
  </main>
  <script src="./script.js">

  </script>
</body>
</html>

```

```js
javaScript
let textInput=document?.getElementById('text-input');

let checkButton=document?.getElementById('check-btn');

let output=document?.getElementById(result);

console.log(textInput.value); //first console.log

console.log(checkButton); //second console.log

let checkButtonClicked=false;

checkButton?.addEventListener("click", () => {

checkButtonClicked===true;

})

console.log(checkButtonClicked); //third console.log

if (checkButtonClicked===true&&textInput===null){

alert("Please input a value");

}

for (let i in textInput){

//console.log(i);

}

```

Does that work. For clarity the css tab is blank also in addition parts of code in addition to console.log command are not going to be in the final version just there for now.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:07pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/5 "2025-04-24T15:07:40Z")

</div>

![image](https://global.discourse-cdn.com/freecodecamp/original/4X/7/5/e/75eede42755d980927b8de76718a4734085ce3f8.png)

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 3:13pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/6 "2025-04-24T15:13:45Z")

</div>

I’ve edited your post to improve the readability of the code. 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.

 ![Pre-formatted-text](https://global.discourse-cdn.com/freecodecamp/original/3X/1/b/1b18854f1059217f29370444396145cc3a0cd8ae.gif)

See [this post](https://forum.freecodecamp.org/t/forum-code-formatting/25574) to find the backtick on your keyboard.  
**Note:** Backticks (`) are not single quotes (').

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:14pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/7 "2025-04-24T15:14:19Z")

</div>

For clarity one more false is outputed below the third {} that cannot be seen in the print screen. Let me know if I have provided what you need even if not in best way.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:17pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/8 "2025-04-24T15:17:23Z")

</div>

Thankyou for showing I will do this next time I am in this situation or at least try. However it sounds very simple now I know what to do.

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 3:17pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/9 "2025-04-24T15:17:34Z")

</div>

I’m confused by the amount of logic you have in the global space? All of your logic should be inside the function that runs when the button is clicked.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:24pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/10 "2025-04-24T15:24:39Z")

</div>

Yes this is change I probably have to make stacking functions have never been my strong point it has not been my strong point. I possibly need to do some training outside the main course on this.

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 3:28pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/11 "2025-04-24T15:28:52Z")

</div>

I’m not sure what a “stacking function” is?

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:40pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/12 "2025-04-24T15:40:53Z")

</div>

I might mean Functional programming but I don’t have the knowledge to be sure. What I referring is (user created) functions calling other (user created) functions particularly when you getting to level of complexity of for example the ‘create a role playing game lab’. I am in my comfort zone and way my brain more thinks, to use functions more minimally. I happy to say more if requested.

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [April 24, 2025, 3:41pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/13 "2025-04-24T15:41:33Z")

</div>

you can use one function only for this project, as long as it’s called and gets value at the right time

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 3:45pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/14 "2025-04-24T15:45:35Z")

</div>

You definitely don’t need Functional Programming or multiple functions to accomplish this. But your logic does need to be in a function that is called when the button is clicked.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 3:53pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/15 "2025-04-24T15:53:19Z")

</div>

If you can remember back to my post about javaScripts style of programming and me thinking javaScript potentially being object orientated programming was the issue. It has since become clear that my problem was the number of functions in the programs and the complex interactions between them. This is a non-language specific problem. I have been thinking of working out or asking how to improve my comfortability with function heavy programming (let me know if I am referring to functional programming). Any help on this is much appreciated.

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 3:55pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/16 "2025-04-24T15:55:29Z")

</div>

Functional Programming is a specific paradigm that is different than just using functions.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 4:10pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/17 "2025-04-24T16:10:19Z")

</div>

I thought so but do you know understand what I mean when I said stacking functions and function heavy programming.

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [April 24, 2025, 4:11pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/18 "2025-04-24T16:11:48Z")

</div>

Sorta? You do not have to use a bunch of small functions if you don’t want to, but understanding the basic idea of functions and when to use them is pretty critical to writing code.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [April 24, 2025, 4:17pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/19 "2025-04-24T16:17:40Z")

</div>

Let park the greater topic for now. Back to the project in question do I need to make greater progress on the program before you can work out how to help. I have make a bit more progress since sent my code.

---

<div class="post-metadata">

**Author:** ![markcactus](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/markcactus/32/378805_2.png) [@markcactus](https://forum.freecodecamp.org/u/markcactus)\
**Post date:** [May 8, 2025, 12:39pm UTC](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725/20 "2025-05-08T12:39:11Z")

</div>

I still need help. I thought of creating a new post but decided it best to just continue with this one. This comment should stand alone with no need to read the other ones.  
I look for help to make the code I have done so far work. More specifically have the output of the program change based on whether the check button has been pressed and whether text has included in the text box, when clicking the check button. My code so far is included below, note my CSS file is empty hence it not being included. Please note parts of JavaScript program are included for debugging purposes and will not be in the final version.

```auto
<!DOCTYPE html>
<html>
<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>
      <p>Enter text to see if it is a palindrome.</p>
      <input id="text-input" type="text">
     <button id="check-btn">
       Check
     </button>
     <div id="result"></div>
  </main>
  <script src="script.js"></script>
</body>
</html>

```

JavaScript

```auto
let textInput=document?.getElementById('text-input');
let checkButton=document?.getElementById('check-btn');
let output=document?.getElementById(result);
console.log(textInput.value); //first console.log test
console.log(checkButton); //second console.log test
let checkButtonClicked=false;
checkButton?.addEventListener("click", () => {
  checkButtonClicked===true;
})
console.log(checkButtonClicked); //third console.log test
if (checkButtonClicked===true&&textInput===null){
  alert("Please input a value");
}
for (let i in textInput.value){
  console.log(i); //fourth console.log test
}

```

Output (not empty line before and after)

```auto

{}
false

```

[Next page](https://forum.freecodecamp.org/t/palindrome-checker-project-ignoring-user-input/744725.md?page=2)