I need to further simplify this solution to auto-format a text-box field intended only for the user to enter their college Grade Point Average (GPA). Here is my code:<label for=collegeGPA>GPA:</label><input type=text name=collegeGPA id=collegeGPA maxlength=4 style=width:45px; onpaste=return false; autocomplete=off ><script type=text/javascript>//<!-- When executed this script [BELOW] auto-formats a Grade Point Average (GPA) field given the element ID [BEGIN] -->function formatGPA(gPAElementID) {    var rE = /\D/g; // remove any characters that are not numbers    var originalGPA = document.getElementById(gPAElementID);    var originalGPAVal = originalGPA.value;    var gPAVal = originalGPA.value.replace(rE,);    var gPAValFirstCharacter = gPAVal.charAt(0);if  ( ( ( parseFloat(originalGPAVal) ) > 4 ) && ( ( parseFloat(originalGPAVal) ) < 5 ) )        {            originalGPA.value = 4.00;        }else         {        if  ( ( gPAVal >= 0 ) &&  ( gPAValFirstCharacter < 5 ) )                {                        gPALen = gPAVal.length;                        if  ( gPALen > 1 )                                {                                    gPAa=gPAVal.slice(0,1);                                    gPAb=gPAVal.slice(1);                                    originalGPA.value = gPAa + . + gPAb;                                 }                    else if ( gPALen == 1 )                                {                                    originalGPA.value = gPAVal + .;                                }                           else                                {                                     originalGPA.value = gPAVal;                                };                }            else                {                     originalGPA.value = ;                };        };};//<!-- When executed this script [ABOVE] auto-formats a Grade Point Average (GPA) field given the element ID [END] -->document.getElementById('collegeGPA').onblur = function (e) { formatGPA(this.id); };document.getElementById('collegeGPA').onfocus = function (e) { formatGPA(this.id); };document.getElementById('collegeGPA').onkeypress = function (e) { formatGPA(this.id); };document.getElementById('collegeGPA').oninput = function (e) { formatGPA(this.id);  };document.getElementById('collegeGPA').onchange = function (e) { formatGPA(this.id); };</script>...and here is my JSFiddle: http://jsfiddle.net/JamesAndersonJr/kxaBJ/1/ I'm looking for a simpler way to format the GPA input dynamically (i.e. as the user types it in). The format should be:1st Character: any digit 0-42nd Character: Always a Period (should also be auto-inserted after user types a valid first digit)3rd Character: any digit4th Character: any digit
Auto-Format GPA while typing : REVISED
javascript;validation