Text character limit - javascript

I have this script and want to implement 12 character limit for each name like first name, last name and middle name can not have more than 12 characters each.
var name = prompt("Please enter (Last name, First name, Middle initial)");
function fullName(alf) {
var validate = alf.match(/^[a-zA-Z', ]+$/);
if (validate == name)
return true;
else
return false;
}
var tst = fullName(name);
if (tst)
document.write("Valid Name");
else
document.write("Invalid Name");

It's fairly simple. Just check the prompt input length as in this snippet. (However if you use input field instead of a prompt you can limit its length by defining "maxlength" e.g. <input type="text" name="yourname" maxlength="10">)
var name = prompt("Please enter (Last name, First name, Middle initial)");
function fullName(alf) {
var validate = alf.match(/^[a-zA-Z', ]+$/);
if (validate == name)
return true;
else
return false;
}
var len = name.length;
var tst = fullName(name);
if (tst && len <= 39) // len 12 * 3 for each value + 3 for spaces/commas separating names.
document.write("Valid Name");
else
document.write("Invalid Name");

Related

Validation input field Fullname(Firstname,Lastname) - JavaScript

Need validation for full name(first name/last name - 1 input field). I'm new in this sphere and can't formulate the right syntax maybe will work with a regular expression too
<form name="myForm" action="#" id="form" onsubmit="return validateForm()" method="POST">
<div class="field"><span class="input"><i class="fas fa-user-alt"></i>
<input type="text" id="name" name="Fullname" placeholder="Full Name" >
</span>
function validateForm() {
var name= document.getElementById('name').value;
var x = name.indexOf(" ");
var fname = name.substring(0, x);
var lname = name.substring(x).trim();
if ( 17 < fname.value.length < 5 || 4 > lname.value.length > 17 || x.value.length != 1) {
alert("try again")
return false;
}
alert("OK")
return true;
}
The field (1 field) should contain 2 words which should be from 3 to 20 symbols.
EDIT:It seems work..finally!
function input (name) {
let fullNameArr = name.split('')
const space = ' '
let firstName = ''
if (fullNameArr.includes(space)) {
for (let i = 0; i < fullNameArr.length; i++) {
if (!firstName.includes(space)) {
firstName += fullNameArr[i]
}
}
}
firstName = fullNameArr.splice(0, firstName.length)
const lastName = fullNameArr
if (firstName.length > 3 && firstName.length <= 21 && lastName.length >= 3 && lastName.length <= 20 && lastName.includes(space) === false) {
console.log(firstName)
console.log(lastName)
} else {
console.log('Invalid Name')
return false
}
}
input('Todor Markov')
Your model makes several assumptions about names. Having first name and last name as separate input boxes is typically done to remove this barrier.
From a UX standpoint, if you were not going to have separate fields, you'd need some validation with a tooltip that checked if the user has more than one space that alerts them they must type FirstName LastName.
From a regex validation view, here's a catch all to ensure it's valid.
/^[a-z ,.'-]+$/i.test("Johnny 'Van' Pat-ton Jr.")
No numbers, but allow letters and the special characters ,.'-.

checking for integer palindrome using javascript

I'm trying, and failing, to check for whether or not a 5-digit integer is a palindrome or not using javascript. I have gotten the code to correctly check for 5-digit strings (not integers yet). That part should be relatively easy to figure out.
My main question: Am I doing the structure for using functions in javascript? If so, how can I get the function call to work properly? It just quits the program upon receiving the desired input.
Code is as follows:
<script type="text/javascript">
var userInput;
var counter = 0;
function palindrome(userInput) {
var re = /[^A-Za-z0-9]/g;
userInput = userInput.toLowerCase().replace(re, '');
var len = userInput.length;
for (var i = 0; i < len/2; i++) {
if (userInput[i] !== userInput[len - 1 - i]) {
return false;
}
}
return true;
}
userInput = window.prompt("Please enter a 5-digit, numerical palindrome: ");
palindrome(userInput);
while (counter < 10){
if (userInput.length == 5){
if (pandindrome(userInput) == true){
document.write("The input is a palindrome!");
}
else if (pandindrome(userInput) == false){
document.write("The input is not a palindrome! Try again!");
userInput = window.prompt("Please enter a 5-digit, numerical palindrome: ");
palindrome(userInput);
}
counter++;
}
else if (userInput.length != 5){
alert("The input you entered was not 5-digits! Please try again!");
userInput = window.prompt("Please enter a 5-digit, numerical palindrome: ");
palindrome(userInput);
}
}
</script>
I have tested your code, everything works fine!
FIY, I set a variable isPalindrome to store the return value from the function palindrome. Then you can use it directly inside if statement, instead of compare to true.
var userInput;
var counter = 0;
function palindrome(userInput) {
var re = /[^A-Za-z0-9]/g;
userInput = userInput.toLowerCase().replace(re, "");
var len = userInput.length;
for (var i = 0; i < len / 2; i++) {
if (userInput[i] !== userInput[len - 1 - i]) {
return false;
}
}
return true;
}
userInput = window.prompt("Please enter a 5-digit, numerical palindrome: ");
var isPalindrome = palindrome(userInput);
while (counter < 10) {
if (userInput.length == 5) {
if (isPalindrome) {
document.write("The input is a palindrome!");
} else {
document.write("The input is not a palindrome! Try again!");
userInput = window.prompt(
"Please enter a 5-digit, numerical palindrome: "
);
isPalindrome = palindrome(userInput);
}
counter++;
} else if (userInput.length != 5) {
alert("The input you entered was not 5-digits! Please try again!");
userInput = window.prompt("Please enter a 5-digit, numerical palindrome: ");
isPalindrome = palindrome(userInput);
}
}

How do I change the format of digit inputs

Basically, I want to change a person input from 0######### to (0#)########, the event im using is onblur
function numberChange(){
var check = document.getElementById("number").value;
var regCheck = /^[0-9]+$/;
if (check != 10 || !regCheck)
{
alert("Please input your 10 digit mobile number")
return false;
}
else if (check == 10 || regCheck)
{
return true;
}
}
Your regCheck should be ^\(0\d\)\d{8}$
Demo
Update :
This regex validates the number of characters, you can omit length check in your code :
function numberChange(){
var check = document.getElementById("number").value;
var re = new RegExp(/^\(0\d\)\d{8}$/);
if (re.test(check)) {
return true;
}
else {
alert("Please input your 10 digit mobile number")
return false;
}
}
This will check for 10 digits, first number is zero, and that all inputs are digits. Once all of that passes the code will add the '(' & ')' to it. This approach gives specific errors depending on how the user incorrectly entered the number.
<html>
<body>
Phone number: <input type="text" id="number" onblur="checkNumber()">
<script>
function checkNumber() {
var x = document.getElementById("number").value;
// Check for 10 digits.
if(x.length != 10) {
alert('The number must be 10 digits.');
return false;
}
// Make sure the first digit is 0.
if(x.charAt(0) != 0) {
alert('The first digit must be 0.');
return false;
}
// Make sure all digits are numbers and not characters.
if(isNaN(x) == true) {
alert('All digits must be numbers.');
return false;
}
// If here then everything else passed so add the '(' and ')' to the number.
document.getElementById("number").value = '(0' + x.charAt(1) + ')' + x.substring(2, 10);
}
</script>
</body>
</html>

How to get alerts for inputed name length of characters - javascript

Hello im trying to do a simple script here when i enter name in input field, i want to get certain alerts for example:
- if name is > 20 characters alert = "name is bigger than 20"
- if name is between 12 and 20 alert = exact number of chars of the name that was inputed
- if name is bigger than 2 chars and bigger or equal than 20 = alert that name
this was just an example of what im trying to do, but im just noob at this point im only 1 month into javascript(html and css) so if anyone can point me in the right direction i would appreciate.
Ok, so far i have this:
<form name="myForm" id="form2" onsubmit="return validate()">
Input name: <input type="text" name = "myName" id="t" />
<input type="submit" name="submit" value="submit" />
</form>
function validate() {
if(document.myForm.myName.value.length>20){
alert("your name is too big");
submitFlag=false; // im not sure what this line does //
} else if(document.myForm.myName.value.length=12-20){
alert("your name is" + document.myForm.myName.value.length + " chars");
} else if(document.myForm.myName.value.length=0){
alert("input name")
}else{
alert("ok e")
}
return submitFlag;
}
THe if statements are workin only if i have two, im getting only the first 2 alerts, so i would like to input more else if statements and to get alerts for them also, i tried to put some more myself, but the dont work, im only getting the first two.
Extending what #dfsq have said,.. you try to get:
if name is between 12 and 20
that means smth like:
document.myForm.myName.value.length > 12 && document.myForm.myName.value.length <= 20
And make your code more simple and readable. And don't forget to return false (your submitFlag):
function validate() {
var len = document.myForm.myName.value.length;
if (len > 20)
{
alert("your name is too big");
}
else if (len > 12 && len <= 20)
{
alert("your name is" + len + " chars");
}
else if (len == 0)
{
alert("input name");
}
else
{
//in fact it would alert when name between 0 and 12
alert("ok e");
}
return false;
}
There are a difference between operators. = is an assignment, == and === are comparison operators. You need latter:
document.myForm.myName.value.length == 0
Here we go:
function validate() {
var charLength = document.myForm.myName.value.length,
submitFlag = false; // This flag would be used further to stop the use going ahead from this particular validation
if (charLength > 20) {
// length more than 20
alert("your name is too big");
} else if (charLength <= 20 && charLength > 12) {
// length between 20 and 12
alert("your name is" + charLength + " chars");
} else if (charLength == 0) {
// If no input there
alert("enter name");
} else {
// Otherwise in success condition
alert("ok e");
submitFlag = true;
}
return submitFlag;
}
Jsfiddle: http://jsfiddle.net/fcwbkkd7/

How to keep running my while loop if an empty String is entered in Javascript?

var o = prompt("Enter a Number");
while (isNaN(o)) {
o = prompt("Not a number! Enter a Number");
}
o = parseInt(o);
If I just press Enter and send an empty string to o, it returns NaN when I print var o. I've tried
|| instance of string and get the same problem.
var o = prompt("Enter a Number");
while (isNaN(o) || o === '' ) {
o = prompt("Not a number! Enter a Number");
}
o = parseInt(o);
Try the above.
var o = prompt("Enter a Number");
while (isNaN(o) || o.trim() == '' ) {
o = prompt("Not a number! Enter a Number");
}
o = parseInt(o);
The extra o.trim() == '' condition will ensure that an empty input, as well as just spaces, will trigger the condition again. Without the trim function, this will permit just spaces to go through.

Categories

Resources