Hey all, I’ve been working on the palindrome checker and can’t get it to pass any of the automatic tests. I have seen a few other forum posts about this and have made sure my id’s are all what is expected as well as trying different #result elements. I saw one person having trouble with the submit button so removed it and the text input from a form element. I also tried to remove the section elements but no luck. here is my code:
<!doctypeHTML>
<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>
<section id="pld-checker">
<h1>Is it a palindrome?</h1>
<h2>?emordnilap a ti sI</h2>
<p>A palindrome contains the same order of letters written backwards or forwards.</p>
<p>Type your word in the text box below</p>
<input id="text-input" type="text" placeholder="Please input a value" required>
<button id="check-btn" type ="submit">Check</button>
<div id="result">Racecar is a palindrome</div>
</section>
<script rel="script" src="script.js"></script>
</body>
</html>
const submitBtn = document.getElementById("check-btn")
submitBtn.addEventListener("click",wordTest)
const inputWord = document.getElementById("text-input");
const output = document.getElementById("result");
function wordTest(){
const userInput = inputWord.value
if(userInput === ""){
alert("Please input a value");
}
const filteredInput = userInput.match(/[a-zA-Z\d]+/);
const forward = filteredInput.toString().toLowerCase();
const backward = forward.split("").reverse().join("");
if (forward === backward){
output.textContent = `${userInput} is a plalindrome`;
}else{
output.textContent = `${userInput} is not a plalindrome`;
}
}```
If you have a question about a specific challenge as it relates to your written code for that challenge and need some help, click the Ask for Help button located on the challenge (it looks like a question mark). This button only appears if you have tried to submit an answer at least three times.
The Ask for Help button will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.
Hey all, I’ve been working on the palindrome checker and can’t get it to pass any of the automatic tests. I have seen a few other forum posts about this and have made sure my id’s are all what is expected as well as trying different #result elements. I saw one person having trouble with the submit button so removed it and the text input from a form element. I also tried to remove the section elements but no luck.
Your code so far
<!-- file: index.html -->
<!doctypeHTML>
<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>
<section id="pld-checker">
<h1>Is it a palindrome?</h1>
<h2>?emordnilap a ti sI</h2>
<p>A palindrome contains the same order of letters written backwards or forwards.</p>
<p>Type your word in the text box below</p>
<input id="text-input" type="text" placeholder="Please input a value" required>
<button id="check-btn" type ="submit">Check</button>
<div id="result">Racecar is a palindrome</div>
</section>
<script rel="script" src="script.js"></script>
</body>
</html>
/* file: script.js */
const submitBtn = document.getElementById("check-btn")
submitBtn.addEventListener("click",wordTest)
const inputWord = document.getElementById("text-input");
const output = document.getElementById("result");
function wordTest(){
const userInput = inputWord.value
if(userInput === ""){
alert("Please input a value");
}
const filteredInput = userInput.match(/[a-zA-Z\d]+/);
const forward = filteredInput.toString().toLowerCase();
const backward = forward.split("").reverse().join("");
if (forward === backward){
output.textContent = `${userInput} is a plalindrome`;
}else{
output.textContent = `${userInput} is not a plalindrome`;
}
}
I pasted just your index.html into the project and without any css or js it was able to pass the first 3 automatic tests.
When you try do you not even get the first three passing?
As this is a certificate project, you will have to ask specific questions to get help because we have to give targeted help only.
Hey Hanaa, sorry about the duplicate, i received a message on the first post asking me to use the get help button on the project page and thought I was being asked to do it again.
On my end it passes the first three tests, it’s the tests based around the text input and the check button that fail. When I use the checker myself the with the examples provided I get the expected result, for example;
_eye should have a #result element with ‘_eye is a palindrome’
I’m on my cell so I can’t check now but in the meantime, I would advise that you check the console as sometimes the messages there show us where we went wrong. Make sure all your variables are declared with const or let (otherwise the test will fail)