Click here to Skip to main content
14,832,124 members
Please Sign up or sign in to vote.
1.50/5 (2 votes)
See more:
I want to delete the character typed in the text box if it is not a number or decimal point in key press event. but I can not do this in the code that handle key press event because the character is displayed after key press event. please tell me how can I do this ?
when a character is typed, if it is other than number, I want to delete it, because if it is not deleted, if user does not delete it, that will lead to incorrect data.
I want to display only numbers and one decimal point. if user types any other character it should not displayed in the textbox.

JavaScript
span = document.createElement("span");
var txt1=($('<input>').attr('type', 'text').attr('id', 'id1').appendTo(span));
txt1.bind("keypress", function () {
    if (!validatedText(txt1.attr('id'), event)){
         removeCharEntered(txt1.attr('id'));
    }
});
var validatedText = function (id, event) {
var text=$('#' + id).val();
var len = text.length;
var ch = event.charCode;
//check for number
if (ch != 46) {
    if ((ch < 48) || (ch > 57)) {
        alert('please enter numbers only.');
        return false;
    }
}
//check for more than one decimal
else
    for (var i = 0; i < len; i++) {
        if (text.charAt(i) == '.'){
            alert('please enter numbers only.');
            return false;
        }
    }
return true;
};
//remove if character is not a number and decimal 
var removeCharEntered = function (id) {
var text = $('#' + id).val();
var len = text.length;
$('#' + id).val(text.substr(0,len - 1));
}
Posted
Updated 20-Jan-16 3:09am
v3
Comments
John C Rayan 20-Jan-16 11:35am
   
Have a look at REGEX.
Sergey Alexandrovich Kryukov 20-Jan-16 12:35pm
   
This is the inquirer's problem. Please see my comment below and Solution 1.
—SA
Sergey Alexandrovich Kryukov 20-Jan-16 12:34pm
   
You don't need to "delete" it. You can filter out key presses so certain characters won't even appear.
—SA

1 solution

Please see my comment to the question. Deleting wrong character is not a valid option. Instead, you should filter out some unwanted characters, so they won't even appear in the input.

For this purpose, your event handler should have an additional argument (which you need anyway), the instance of the event object, let's say, its name is event. On certain condition, you want to block some character from input. This is done by calling the function event.preventDefault():
https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault[^].

(See also: Event.defaultPrevented — Web APIs | MDN[^], Event.stopPropagation() — Web APIs | MDN[^].)

It does not matter if you do it using jQuery or not. Please see this jQuery help page: .keypress() | jQuery API Documentation[^].

On this page, please find the sample code fragment with event.preventDefault(); from this code sample, you will see how to use this technique with jQuery.

—SA
   
v3
Comments
Member 7854207 21-Jan-16 8:45am
   
by using preventDefault() function my problem is solved. Thanks a lot.
   
You are very welcome.
Good luck, call again.
—SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900