Validating a text box value using javascript 1

[swathip]

Hi all,
I have a textbox.The user will be entering entering a number in this box.The user should enter two digits followed by a period "." and another digit.It would look something like 22.3 or 00.5 or 01.2.

If the textbox is not empty,I want to enforce a function which validates the value entered by the user(and gives them an alert if the value entered is not according to the format mentioned above) .This function needs to be triggered when the textbox loses its focus.I am not sure how to go ahead in writing this function as i am still new to this.
Any help would be appreciated.Thanks in advance.

p.s This function should be triggered each time there is a change in the value.Like suppose, the user enters a value 22, then when the textbox loses its focus,the javascript function should be triggered giving them an alert asking the user to change it to the accepted format which is 22.0.The function should be triggered again when the textbox loses its focus(after the change has been done).This time there would not be an alert since the user entered it in the right format.

 

[vacunita]

1. use the onBlur event of the textbox to call the function.

2.a Check that the textbox contents is indeed 4 characters long (2 numbers + 1 period + 1 number). you could of course enforce this by specifying the maximum length of the textbox. But of course the could still put in less characters.

2.b Check that the period is at the third position of the value. If its there, and its 4 characters long, then its a valid value.

<script>
function check_number_format(TxtBox){
var error_message="";
if(TxtBox.value.length!=4){
error_message+="Make sure the input is 4 characters long \n\r";
}

if(TxtBox.value.charAt(2)!="."){
error_message+="Period is incorrectly placed or missing";
}
if(error_message!=""){
alert(error_message);
return false;
}
return true;
}

</script>

<input type="text" onBlur="check_number_format(this);">

You could still apply a further check to make sure its an actual number instead of values like aa.a or xb.d. You can use the isNaN() function to check for that.

http://www.tek-tips.com/viewthread.cfm?qid=1607051&page=1

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/

 

[vacunita]

Sorry pasted wrong link it should be:

http://www.w3schools.com/jsref/jsref_isNaN.asp

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/