Setting Value in Javascript with encoded HTML

Question

Quick question, I have a simple javascript problem that I don't know the fix to.

divNext = document.getElementById("submit_button");
if(document.getElementById("page").value == 4 ? divNext.value = 'Submit' : divNext.value = 'Next »');

Now the problem is that it should display the Next with two >> after it (at least if they where encoded) however it displays them with the actual content there. How can I get it to display the html encoded character? Thanks in advanced

Answer 1

That is because you have HTML-encoded the character instead of encoding it to be in a Javascript string.

And by the way, you are using both the if and the ? conditional operator incorrectly.

divNext = document.getElementById("submit_button");
divNext.value = document.getElementById("page").value == 4 ? 'Submit' : 'Next \xBB';

Or using if:

divNext = document.getElementById("submit_button");
if (document.getElementById("page").value == 4) {
  divNext.value = 'Submit'
} else {
  divNext.value = 'Next \xBB';
}

Answer 2

Just put them in

document.getElementById("page").value == 4 ? divNext.value = 'Submit' : divNext.value = 'Next >>');

or use .innerHTML

document.getElementById("page").value == 4 ? divNext.innerHTML = 'Submit' : divNext.innerHTML = 'Next »»');

Also, if you are using the ternary operator why do you have an if?