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.


Related Solutions

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];   ...
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...
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...
I already have the code of this program, I just want to know how to fix...
I already have the code of this program, I just want to know how to fix the code to Implement the 5th function (System.nanotime() and System.currentTimeMillis() methods) What Code does: Introduction Searching is a fundamental operation of computer applications and can be performed using either the inefficient linear search algorithm with a time complexity of O (n) or by using the more efficient binary search algorithm with a time complexity of O (log n). Task Requirements In this lab, you...
3) I have an ionization detector that is filled with a gas that undergoes ionization with...
3) I have an ionization detector that is filled with a gas that undergoes ionization with on average 100 eV of input energy. A positive voltage is applied to a wire running down the center of the cylindrical detector, while the outer cylinder wall is held at negative voltage; I can control both of those voltages. a) I find that when I measure a Cs-137 source and then a Co-60 source at one voltage, I find that measured currents are...
How can I convert inRange in cv2 to PIL? For example, I already have mask =...
How can I convert inRange in cv2 to PIL? For example, I already have mask = cv2.inRange(img, array1, array2) but I'm trying to keep everything in PIL. Any ideas would be appreciated!
I have already created the journal entries for the following information but I need the t-accounts,...
I have already created the journal entries for the following information but I need the t-accounts, income statement, statement of retained earning and balance sheet: The following transactions occurred during 2018 (the company uses a perpetual inventory system with FIFO): 1)      Jan 4 Stockholders invested an additional $10,000 cash in the business in exchange for common stock 2)      Jan 4 Purchased 20 rabbits at $50 each on account from Jelly Bean Farms. 3)      Jan 4 Established a $200 petty change...
explain your answer step by step, i already have the answer but i need the explnations...
explain your answer step by step, i already have the answer but i need the explnations and type your answer, thanks 4 FeS2   +   11 O2    ®    2 Fe2O3    +    8 SO2 1.    How many moles of oxygen are required to react with 3.75 moles of FeS2?        2.    How many moles of Fe2O3 are formed when 2.83 moles of oxygen reacts with        excess FeS2? 3.    How many moles of SO2 are formed when 2.81 moles of Fe2O3 are...
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT