Hi all,

I'm trying to change an <input> to either "st", "nd", "rd" or "th" depending on what value is another box, so collectively the two cells will look like "3rd" or "21st" etc

The code I'm using is:
function stndrdth()
	var theinput = document.getElementById("hole_number").value;
	var righthandnumber = theinput.charAt(theinput.length-1);
	if( righthandnumber == 1 )
		document.getElementById("stndrdth").value = 'st';
	else if( righthandnumber == 2 )
		document.getElementById("stndrdth").value = 'nd';
	else if( righthandnumber == 3 )
		document.getElementById("stndrdth").value = 'rd';
		document.getElementById("stndrdth").value = 'th';


<input id="hole_number" name="hole_number" maxlength="3" size="3" onkeypress="stndrdth()" onchange="stndrdth()" onkeyup="stndrdth()" />
<input id="stndrdth" name="stndrdth" size="2" maxlength="2" /> hole 
<a href="javascript:stndrdth()">A link</a>

I don't understand why if I click on the link, it works, but altering the number in the "hole_number" box doesn't

What confuses me more is if I remove the <form> tags, it works as expected

Any help will be appreciated