Question

In: Computer Science

I already have an alert message that pops up when the number is not filled in...

I already have an alert message that pops up when the number is not filled in correctly. How would I change that alert function to something similar to this function.

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>

<script>
   function phonenumber(inputtxt){
      
   var phoneno = (\(\d{3}\)|\d{3})[-\s]\d{3}-\d{4};
  
   if(inputtxt.value.match(phoneno)){
       document.getElementById("yourEntry").innerHTML = document.getElementById("myphone").value;
   }
   //if(!inputtxt.value.match(phoneno)){
       // alert("Does not Work!")
       //}
   }
</script>
</head>

<body>
<form name="form1" action="#">
<input type="text" name="myphone" id="myphone" value="" pattern= "(\(\d{3}\)|\d{3})[-\s]\d{3}-\d{4}" placeholder="(555) 555-1212" required />
<input type="submit" value="Submit" onclick="phonenumber(document.form1.myphone)"/>
</form>
Your results are as follows:
<p id="yourEntry">
</p>
</body>
</html>

Here is my complete code that I would like to keep plus having the right message alert.

<!Doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Login and Registeration Form Design</title>
<link rel="stylesheet" type="text/css" href="../signin.css">

<script>
function myFunction(){
phoneno = document.getElementById('phone').value;
console.log("qer"+phoneno);
var error = document.getElementById("error")
if(phoneno===""){
// Changing content and color of content
error.textContent = "Please enter a valid number"
error.style.color = "red"
} else {
error.textContent = ""
document.getElementById('demo').innerHTML = document.getElementById('fname').value + " " + document.getElementById('lname').value + " " + document.getElementById('street').value + " " + document.getElementById('city').value + " " + document.getElementById('zcode').value + " " + document.getElementById('email').value + " " + document.getElementById('phone').value;
}
}
</script>
</head>

<body>
<div class="login-page">
<div class="form">
<br>
<h1> Register </h1>
<input type="text" id="fname" placeholder="first name"/>
<input type="text" id="lname" placeholder="last name"/>
<input type="text" id="street" placeholder="street address"/>
<input type="text" id="city" placeholder="city"/>
<input type="text" id="zcode" placeholder="zip code"/>
<input type="text" id="email" placeholder="email address"/>
<input type="text" id="phone" value="" pattern="(\(\d{3}\)|\d{3})[-\s]\d{3}-\d{4}" placeholder="XXX-XXX-XXXX" required/>
<span id="error"></span>
<button onclick="myFunction()">Create</button>
<label for="create login" id="create login"></label>
<p id="demo"></p>
</div>
</div>
</body>
</html>

Solutions

Expert Solution

So I am going to Edit your second code with Implementation of Alert message:

<!Doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Login and Registeration Form Design</title>
<link rel="stylesheet" type="text/css" href="../signin.css">

<script>
function myFunction(){
phoneno = document.getElementById('phone').value;
console.log("qer"+phoneno);
var error = document.getElementById("error")
if(phoneno!==phone){
alert("Please Enter Valid Phone number!!"); // alert Box in case Phone number format is wrong.
} else {
error.textContent = ""
document.getElementById('demo').innerHTML = document.getElementById('fname').value + " " + document.getElementById('lname').value + " " + document.getElementById('street').value + " " + document.getElementById('city').value + " " + document.getElementById('zcode').value + " " + document.getElementById('email').value + " " + document.getElementById('phone').value;
}
}
</script>
</head>

<body>
<div class="login-page">
<div class="form">
<br>
<h1> Register </h1>
<input type="text" id="fname" placeholder="first name"/>
<input type="text" id="lname" placeholder="last name"/>
<input type="text" id="street" placeholder="street address"/>
<input type="text" id="city" placeholder="city"/>
<input type="text" id="zcode" placeholder="zip code"/>
<input type="text" id="email" placeholder="email address"/>
<input type="text" id="phone" value="" pattern="(\(\d{3}\)|\d{3})[-\s]\d{3}-\d{4}" placeholder="XXX-XXX-XXXX" required/>
<span id="error"></span>
<button onclick="myFunction()">Create</button>
<label for="create login" id="create login"></label>
<p id="demo"></p>
</div>
</div>
</body>
</html>

This Code should Alert User that Number Format is not right.

Please Consider a Thumps-up(like),It helps alot to answer such questions.

venereology answered 2 years ago
Next > < Previous

Related Solutions

I don't know why my java code is not running this error code pops up -->...
I don't know why my java code is not running this error code pops up --> Error: Could not find or load main class DieRoll Caused by: java.lang.ClassNotFoundException: DieRoll. Code below:    import java.util.Random;    import java.util.Scanner;    public class Assignment {    public static void combineStrings() {    String school = "Harvard";    String city = "Boston, MA";    int stringLen;       String upper, changeChar, combine;       stringLen = school.length();    System.out.println(school+" contains "+stringLen+" characters." );   ...
I have the following python code. I get the following message when running it using a...
I have the following python code. I get the following message when running it using a test script which I cannot send here: while textstring[iterator].isspace(): # loop until we get other than space character IndexError: string index out of range. Please find out why and correct the code. def createWords(textstrings): createdWords = [] # empty list for textstring in textstrings: # iterate through each string in trxtstrings iterator = 0 begin = iterator # new begin variable while (iterator <...
I need to take the code i already have and change it to have at least...
I need to take the code i already have and change it to have at least one function in it. it has to include one function and one loop. I already have the loop but cant figure out how to add a function. I thought i could create a funciton to call to the totalCost but not sure how to do it. Help please. #include #include //main function int main(void) {    char userName [20];    char yesOrNo [10];   ...
hi! I have this code. when I run it, it works but in the print(the number...
hi! I have this code. when I run it, it works but in the print(the number we are searching for is ) it prints the number twice. ex. for 5 it prints 55 etc. apart from this, it works #include <stdio.h> #include <stdlib.h> #include <time.h> int main(){ int n,i; printf("Give me the size of the table : \n"); scanf("%d", &n); int A[n],x,y; for (i=0;i<n;i++) A[i]=rand() % n; for (i=0;i<n;i++) printf("%d\n", A[i]); srand(time(NULL)); y=rand()% n ; printf("The number we are searching...
when the user entered a negative number, you output a message that it was not possible...
when the user entered a negative number, you output a message that it was not possible to take the square root of a negative number. This time you will write a Python program that asks the user to enter a non-negative number (float). If the user does enter a negative number, you will use a while loop to continue prompting the user until you get a valid number (i.e. a number >= 0). Once the user enters a valid number,...
Java homework problem: I need the code to be able to have a message if I...
Java homework problem: I need the code to be able to have a message if I type in a letter instead of a number. For example, " Please input only numbers". Then, I should be able to go back and type a number. import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JLabel; import javax.swing.JPanel; import javax.swing.JTextField; public class LoginGui {    static JFrame frame = new JFrame("JFrame Example");    public static void main(String s[]) {        JPanel panel...
In Python, I have a turtle that is already coded to move in correlation with the...
In Python, I have a turtle that is already coded to move in correlation with the keys I set (I can control the turtle). I need to put a second turtle in that moves WHILE the first turtle is moving and being controlled. The second turtle needs to do the following while the first turtle is still listening and being controlled: -It needs to begin facing a random direction -It needs to move at a speed of .5 the entire...
So I have a lab practical coming up; how do I know when to take an...
So I have a lab practical coming up; how do I know when to take an IR spec versus making a TLC chamber? Follow up question: Can someone walk me through the interpretation of a TLC chamber?
I have a programming project due tonight that I have already done once but my professor...
I have a programming project due tonight that I have already done once but my professor sent back because he said I did it wrong. He wants the following using linked lists but i only know how to do it with Arrays. Please try to explain your answer to me and not just give it to me. For this assignment you must write a program that implements a stack of integers. The stack should be implemented using classes and must...
PLEASE I HAVE TO RETURN IN 20 MINUTES, I HAVE ALREADY DO THE QUESTION 1, 2,...
PLEASE I HAVE TO RETURN IN 20 MINUTES, I HAVE ALREADY DO THE QUESTION 1, 2, 3, 4 BUT THE QUESTION 5 I CAN'T In python : 1)Write a sum function expecting an array of integers and returning its sum. 2) Write a multiply function excepting two arrays of integers and returning the product array term by term. For example mutliply([1,2,3], [5,4,3]) will give [5,8,9] 3) Write a nb1 function expecting an array containing only 0 and 1 and returning...
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT