Develop Reference

Allow only numbers and letters to input string

I'm trying to avoid input of any marks except numbers and letters with input string on my page.php:
<input type="text" id="input">
From this answer only allow English characters and numbers for text input <input type="text" id="input" class="clsAlphaNoOnly"> :
$(document).ready(function () {
$('.clsAlphaNoOnly').keypress(function (e) { // Accept only alpha numerics, no special characters
var regex = new RegExp("^[a-zA-Z0-9 ]+$");
var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(str)) {
return true;
}
e.preventDefault();
return false;
});
})
or this:
$(function(){
$("#input").keypress(function(event){
var ew = event.which;
if(ew == 32)
return true;
if(48 <= ew && ew <= 57)
return true;
if(65 <= ew && ew <= 90)
return true;
if(97 <= ew && ew <= 122)
return true;
return false;
});
});
in both cases string is clear, but I'm using two types of input with button click $("#btn").click(function() to process input and $(document).keypress(function(e) with hit on enter key on keyboard for same input. By some reason if I include this methods to avoid extra marks in string, pressing on enter key does not allows to input inserted value.
This way works fine:
<input type="text" id="input" onkeypress="return (event.charCode >= 65 && event.charCode <= 90) || (event.charCode >= 97 && event.charCode <= 122) || (event.charCode >= 48 && event.charCode <= 57)" />
but I want avoid extra code with html in page.php. I'm trying to figure out, what causes blocking of entering for inserted value with given methods

Would tell you may miss event parameter ?
Without jQuery works like this for me in 3 browsers:
function clsAlphaNoOnly (e) { // Accept only alpha numerics, no special characters
var regex = new RegExp("^[a-zA-Z0-9 ]+$");
var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(str)) {
return true;
}
e.preventDefault();
return false;
}
function clsAlphaNoOnly2 () { // Accept only alpha numerics, no special characters
return clsAlphaNoOnly (this.event); // window.event
}
<input type="text" id="input" onkeypress="clsAlphaNoOnly(event)" onpaste="return false;">
<input type="text" id="input" onkeypress="clsAlphaNoOnly2()" onpaste="return false;">

One way of validation is using pattern attribute on input element
MDN: https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation#Validating_against_a_regular_expression
In your case:
<input type="text" pattern="[a-zA-Z0-9]*">

If you really do not want to use the Regex method as the comments bellow advice you, then you can use this simple code :
document.querySelector("input#testInput").addEventListener("input", function(){
const allowedCharacters="0123456789azertyuiopqsdfghjklmwxcvbnAZERTYUIOPQSDFGHJKLMWXCVBNzáàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑ "; // You can add any other character in the same way
this.value = this.value.split('').filter(char => allowedCharacters.includes(char)).join('')
});
<input type="text" id="testInput">

Instead of javascript you could use a pattern along with required. pattern will allow you to specify a required pattern for the input, and required will make the input required. Both must evaluate to true in order for the form to submit.
<form>
<input type="text" id="input" pattern="[a-zA-Z0-9]+" required>
<input type="submit">
</form>

HTML Input Way :
1- Simple HTML5 Input
<input type="text" pattern="[a-zA-Z0-9]*">
2- Inline Function
<input type="text" id="input" onkeypress="return (event.charCode >= 65 && event.charCode <= 90) || (event.charCode >= 97 && event.charCode <= 122) || (event.charCode >= 48 && event.charCode <= 57)" />
Jquery Way :
$('#ID').on('keypress', function (e) { var code = ('charCode' in e) ? e.charCode : e.keyCode; if (!(code > 47 && code < 58) && !(code > 64 && code < 91) && !(code > 96 && code < 123)) {e.preventDefault();}});
Javascript Function :
function allowAlphaNumericSpace(e) {
var code = ('charCode' in e) ? e.charCode : e.keyCode;
if ( !(code > 47 && code < 58) && !(code > 64 && code < 91) && !(code > 96 && code < 123)) { e.preventDefault();}};
<input type="text" onkeypress="allowAlphaNumeric(event)" />

how to remove nan in jquery

i have input numeric field with format like 20,000.00
how to remove Nan if user not key in the first field?
document.getElementById("BasicSalary_x").onblur =function (){
this.value = parseFloat(this.value.replace(/,/g, ""))
.toFixed(2)
.toString()
.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
function isNumberKey(evt) {
var charCode = ((evt.which) ? evt.which : event.keyCode);
return !(charCode > 31 && (charCode != 46 && charCode != 44 && (charCode < 48 || charCode > 57)));
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="tel" onkeypress="return isNumberKey(event)" id="BasicSalary_x" placeholder="Basic Salary (RM)" >
<input type="tel" value="0.00" onkeypress="return isNumberKey(event)" id="deduction" placeholder="Deduction (RM)" >

If you get NaN with parseFloat, then you can use ||0 to convert it to zero (or any default you prefer).
parseFloat("x,xx".replace(/,/g, "")) || 0
Alternatively, you can check if it's a number with isNaN
var val = this.value.replace(/,/g, "");
if (isNaN(val)) {
alert("Please only enter valid values.");
} else {
... parseFloat(val) ...
}
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/isNaN

Restrict table data 'contenteditable' attribute to only Integer

The below code allows me to edit the table data row but may i know how can i restrict it to only integers.
Thank you in advance for your time :)
<td contenteditable="true" class="product_rate"></td>

Well, you can try reading the keyCode of the onkeypress event, determining whether it is a number (0-9) or not and then returning true or false respectively
<td onkeypress = "return testCharacter(event);" contenteditable="true" class="product_rate"></td>
function testCharacter(event) {
if ((event.keyCode >= 48 && event.keyCode <= 57) || event.keyCode === 13) {
return true;
} else {
return false;
}
}

if ((event.keyCode >= 48 && event.keyCode <= 57) || event.keyCode === 13)
those numbers are the assci code in decimal:
https://www.ascii-code.com/
48 is for the 0; 57 is for the 9; 45 is for the -

How to remove/delete first space of word using javascript or jquery?

I want to remove first space from text field. i have created function which allow only characters.
Here is my html code :
<form:input path="deliveryBoyName" id="deliveryBoyName"
maxlength="100" class="form-control"
onkeypress="return onlyAlphabets(event,this);">
</form:input>
Here is my javascript function :
function onlyAlphabets(e, t) {
try {
if (window.event) {
var charCode = window.event.keyCode;
}
else if (e) {
var charCode = e.which;
}
else { return true; }
if (charCode == 0 || charCode == 8 || charCode == 17 || charCode == 20 || charCode == 32 || (charCode > 64 && charCode < 91) || (charCode > 96 && charCode < 123))
return true;
else
return false;
}
catch (err) {
alert(err.Description);
} }
Now if user first types space then it should remove. starts only from character.
For example :
If user types like " Hello World"
Then it should not allowed.
If user type like "Hello World" then its should allowed. please help me.
Thank you in advance.

JavaScript trim() function can remove white spaces from both the side.
Here is working fiddle -
var str = " Did you find solution Ashish? If yes then tick it.";
alert(str.trim());

I think you want to allow space only when it is not the first character.
This is what you want, i.e. your function removing all the unnecessary code:
function onlyAlphabets(e, t) {
var charCode = e ? e.which : window.event.keyCode;
return (charCode == 0 || charCode == 8 || charCode == 17 || charCode == 20 ||
(t.value.length && charCode == 32) ||
(charCode > 64 && charCode < 91) ||
(charCode > 96 && charCode < 123))
}

Javascript: Validate for only alpha and space

I have this function which I use to validate for letters only when a user inputs something in a textbox.
I just realized it does not accept spaces. How would I fix this? Just add the charCode value to the equation?
function isLetter2(evt) {
evt = (evt) ? evt : event;
var charCode = (evt.charCode) ? evt.charCode : ((evt.keyCode) ? evt.keyCode :
((evt.which) ? evt.which : 0));
if (charCode > 31 && (charCode < 65 || charCode > 90) &&
(charCode < 97 || charCode > 122)) {
return false;
}
return true;
}

A space is charcode 32 (hexadecimal 20), so just add this line before your first if statement.
if (charCode == 32) return true;
followed by your original if statement. (No additional else statement is needed between them since the function will now stop and return true as soon as a space is detected.)
update: your original if statement can be simplified by De Morgan's laws to <= 31 or (inclusively between 65 and 90) or (inclusively between 97 and 122). So it would also work fine just to change your first > 31 to be > 32 since its negation would be <= 32 and result in returning of true, thus allowing a space to be typed. But I am not sure why you would want to allow all of the other characters less than 32 to be typed... that includes a lot of weird stuff. Maybe you should change your code to be like this:
if (charCode == 32 ||
(charCode >= 65 && charCode <= 90) ||
(charCode >= 97 && charCode <= 122))
return true;
else return false;
In fact, the result of all those comparisons is itself equal to the value true or the value false, and so you can completely eliminate the if/else statements and just say:
return charCode == 32 || (charCode >= 65 && charCode <= 90) || (charCode >= 97 && charCode <= 122);