How to to create a function that will take an input and test if it's a palindrome or not?

Question

Here's the function I have written right now. The web console isn't doing much for me. Every time a word is entered in the text box, even if it is a palindrome, it just returns "undefinedThis is not a palindrome!".

Not sure what's wrong here. Perhaps something to do with the if statement? How can I make it so that the function ignores capitalized letters? I want it to consider both "bob" and "Bob" a palindrome.

function test() {
    // Assumes: a string is entered into the "palin" text box
    // Results: tests if the string is a palindrome and
    // returns the conclusion to outputDiv

    var word, copy, i;
    word = document.getElementById("palin").value;
    copy = " ";
    i = 0;

    while (i < word.length) {
        copy = word.charAt(i) + copy;
        i=i+1;
    }

    if (word === copy) {
        document.getElementById("outputDiv").innerHTML =
            document.getElementById("outputDiv").value +
            "This is a palindrome!";
    } else {
        document.getElementById('outputDiv').innerHTML =
            document.getElementById('outputDiv').value +
            "This is not a palindrome!";
    }
}

To solve capital-simple mismatching You can convert the whole string to lowercase letters before comparison begins. http://www.w3schools.com/jsref/jsref_tolowercase.asp — tnishada, Dec 07 '14 at 04:43
You should add some `console.log()` or `alert()` statements to debug the values of `word` and `copy` as your program executes. The problem is probably that you initialize `copy` to `' `' (a space) instead of the empty string, `''`. But you need to learn how to debug your own code, so be sure to give the logging a shot. — Mark Peters, Dec 07 '14 at 04:45
@user2570380 No. You would have to do `(word.split("").reverse().join("").toLowerCase() === word.toLowerCase())`. — Aadit M Shah, Dec 07 '14 at 05:00

Aadit M Shah · Answer 1 · 2014-12-07T05:12:20.190

It's best if you separate your logic from your presentation. In your case the logic is the palindrome check. The presentation is getting an input from text box and sending the output to the div.

This is what I would do:

var input = document.getElementById("input");
var output = document.getElementById("output");

document.getElementById("button").addEventListener("click", function () {
    var s = input.value;
    output.innerHTML = s + " is" + (isPalindrome(s) ? "" : " not")
                     + " a palindrome.";
});

function isPalindrome(s) {
    s = s.toLowerCase();
    return s.split("").reverse().join("") === s;
}

<input type="text" id="input"/>
<button id="button">Palindrome?</button>
<div id="output"></div>

As you can see I have put the isPalindrome logic into a separate function. Hence I have separated the logic from the presentation. You should always do this. It makes programming much simpler.

Madhawa Priyashantha · Accepted Answer · 2014-12-07T05:17:04.330

your code is almost correct .here is fixed jsfiddle example

change your codes to

function test() {

    var word, copy, i;
    word = document.getElementById("palin").value.toLowerCase();//turn to lowercase
    copy = "";
    i = 0;

    while (i < word.length) {
        copy = word.charAt(i) + copy;
        i=i+1;
    }

    if (word === copy) {
        document.getElementById("outputDiv").innerHTML =
            document.getElementById("palin").value + " This is a palindrome!";
    } else {
        document.getElementById('outputDiv').innerHTML =
            document.getElementById('palin').value + " This is not a palindrome!";
    }
}

copy = " "; should change to copy = ""; that's first problem because "bob" not equal to "bob " you used document.getElementById("outputDiv").value which is undifined because it's a div not a textarea so value is undifined .what you probably need is document.getElementById("palin").value

How to to create a function that will take an input and test if it's a palindrome or not?

2 Answers2