• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 259
  • Last Modified:

Validate a Non-Required Phone Number Using Javascript

I have a javascript function that is supposed to validate Required Phone Numbers, checking for length and numbers/characters, etc...  I need to modify this to validate a Non-Required Phone Number (if the field is blank, do nothing;  if a user enters a phone number, THEN validate it correctly).   I've tried different variations, but don't understand javascript well enough to make it work.   Here's the original script:

function validateForm(f){
      if(f.userPhone1.value == ""){
            alert("Please enter the Presenter's full phone number (xxx-xxx-xxxx).");
            f.userPhone1.focus();
            return false;
        } else if (!validateUSPhone(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
      }
      
      if (CheckPhoneNumber(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
      }
      f.submit();
}

function CheckPhoneNumber(TheNumber) {
      var valid = 1
      var GoodChars = "0123456789-"
      var i = 0
      if (TheNumber=="") {
      // Return false if number is empty
      return false;
            }
      for (i =0; i <= TheNumber.length -1; i++) {
            if (GoodChars.indexOf(TheNumber.charAt(i)) == -1) {
            // Note: Remove the comments from the following line to see this
            // for loop in action.
            // alert(TheNumber.charAt(i) + " is no good.")
            return false;
            } // End if statement
            if (TheNumber.charAt(i) == "-" && i != 3 && i != 7) {
            return false;
            } // End if statement
      } // End for loop
      return true;
}

function validateUSPhone(str){
   str = strip("*() -./_\n\r\t\\",str);
   if(str.length == 10)
        return true;
   else
        return false;
}

Any help is very much appreciated!!!   I will award full points, as I need to solve this quickly!    Thank you!

0
DeniseBarker
Asked:
DeniseBarker
  • 8
  • 8
7 Solutions
 
b0lsc0ttIT ManagerCommented:
Just change this ...

function validateForm(f){
      if(f.userPhone1.value != ""){
          if (!validateUSPhone(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
      } else if (CheckPhoneNumber(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
      }
      }
      f.submit();
}

Let me know if you have a question or how that works.  It basically will only do the script if the field isn't blank.

bol
0
 
b0lsc0ttIT ManagerCommented:
This is the exact same code but just indented a little better for readability.

function validateForm(f){
      if(f.userPhone1.value != ""){
          if (!validateUSPhone(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
          } else if (CheckPhoneNumber(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
          }
      }
      f.submit();
}

bol
0
 
DeniseBarkerAuthor Commented:
Well, I plugged the suggested code above into my .js file and still have a problem...  It works fine when the phone field is left blank, but when I enter any kind of phone #, be it 10 digits or less, it fails with the error:  "Please enter the Presenter's phone number... " etc....  (If I enter less than 10 digits, it fails on the first validation (!validateUSPhone), and if I correctly put in all 10 digits (like:  111-222-3333) it fails on the second part (CheckPhoneNumber)...    Help!   ???   Thanks!!!
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
b0lsc0ttIT ManagerCommented:
Let me look a little closer.  Was the CheckPhoneNumber function working before?  I made one minor change but I will do it a little different.  It seems like the CheckPhoneNumber function won't have an issue if it is blank so try ...

function validateForm(f){
      if(f.userPhone1.value != ""){
        if (!validateUSPhone(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
        }
      }
      if (CheckPhoneNumber(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
      }
      f.submit();
}

Let me know how that works.  If it doesn't please provide answers to the questions above.  I'll look over the other code a little closer.

bol
0
 
DeniseBarkerAuthor Commented:
Thank you... I'll enter this new code and test and keep you posted... Thanks again -- much appreciated!
0
 
DeniseBarkerAuthor Commented:
Well... I plugged this newer version in and it still fails as before...  The CheckPhoneNumber appears to work fine as long as the field is required; we've never used this in an "unrequired" situation before, so it may be that this function needs rewriting for this particular situation...   Unfortunately, I don't know how it needs to be re-written...  
As with a required phone number, we need it to continue to validate for numbers and dashes only (and in the appropriate sequence), and for exactly 10 digits, and again only if there is something entered in the field (not blank);  if the field is blank, it should be ignored...    Your help is again much appreciated...  Thank you so much!
0
 
b0lsc0ttIT ManagerCommented:
I am going to modify (and improve, I hope) the CheckPhoneNumber function then.  It is confusing as it is and I don't see how it worked.  It would seem to show the message only when it was OK (i.e. valid format).  I will assume the function needs to require, if entered, the number to be 10 digits and use hypens as separators.

function CheckPhoneNumber(TheNumber) {
      return TheNumber.match(/^\d{3}-\d{3}-\d{4}$/);
}

That should  be all you need for this.  You will also need to change the line that calls the function.  I added an exclamation mark.

      if (!CheckPhoneNumber(f.userPhone1.value)) {

Let me know how the changes work.  Don't forget both changes.

bol
0
 
DeniseBarkerAuthor Commented:
It continues...   I entered the changes you specified above, including the !   ...   Now it operates as if the field must be required.  When I leave it blank, I get the 'CheckPhoneNumber' alert;  otherwise it works correctly -- if I enter less than 10 digits, or letters, it will give me the alert, which is correct.  But it won't let me leave the field blank...   Any other ideas?   Thanks so much...
0
 
b0lsc0ttIT ManagerCommented:
I might've made a mistake in using match().  Try ...

function CheckPhoneNumber(TheNumber) {
      return (TheNumber.match(/^\d{3}-\d{3}-\d{4}$/))? true : false;
}

If that still has a problem then add an alert like ...

function CheckPhoneNumber(TheNumber) {
      alert(TheNumber.match(/^\d{3}-\d{3}-\d{4}$/));
      return (TheNumber.match(/^\d{3}-\d{3}-\d{4}$/))? true : false;
}

Let me know how that works.

bol
0
 
DeniseBarkerAuthor Commented:
I  tried the first function above and the results were the same as before -- fails when field is empty.   So I entered the 2nd function above;  now I get a "null" dialog box followed by the same 'CheckPhoneNumber' alert as before, whenever the field is left empty...    Sorry!!   Other changes to try??    Thanks again!!!
0
 
b0lsc0ttIT ManagerCommented:
I can't believe this is kicking my butt. :)

OK.  I just realized a mistake I made when I changed that function.  I think this should fix it; I know this is an issue but with how things are going it is hard to be sure this will be it.  It has been a long day if I am allowed an excuse. :)

Change the main function to ...

function validateForm(f){
      if(f.userPhone1.value != ""){
        if (!validateUSPhone(f.userPhone1.value)) {
            alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
            f.userPhone1.focus();
            return false;      
        }
        if (!CheckPhoneNumber(f.userPhone1.value)) {
              alert("Please enter the Presenter's phone number in format xxx-xxx-xxxx.");
              f.userPhone1.focus();
              return false;      
        }
      }
      f.submit();
}

Let me know how that works.  All of my fingers are crossed.

bol

p.s.  This is making me look like a real amature. :(  Thanks for your patience!
0
 
b0lsc0ttIT ManagerCommented:
The change was putting the CheckPhoneNumber() function in the main If.  That way it will only be done if a number is entered.

bol
0
 
DeniseBarkerAuthor Commented:
Fabulous!   Wonderful!!   Now it accepts the field as empty correctly and validates the field as 10 digits, etc.   The final issue --- when I enter a 10 digit number correctly, it pops up a dialog box showing what I entered.  Can you make that disappear?   We would like for the user to just enter the number and validate without that extra alert...   Thanks so very much!   I appreciate YOUR EXTREME PATIENCE on this!   THANK YOU!
0
 
DeniseBarkerAuthor Commented:
b0lsc0tt: ...
I fixed that last issue mentioned above by commenting out:  
 alert(TheNumber.match(/^\d{3}-\d{3}-\d{4}$/));
0
 
DeniseBarkerAuthor Commented:
b0lssc0tt:
Thank you so very very much for all your assistance and determination!!   Your code is working beautifully now.  We greatly appreciate your assistance -- I never would have figured all that out.  Thanks so very much!!    

I've actually got a very similar problem which I'm posting in a separate question...  Now I need to get the email address validated, and just like with the phone number, this field is not required...  Be on the lookout for it!    Thanks again!!   I'm sure many users will benefit from your efforts...
0
 
b0lsc0ttIT ManagerCommented:
Your welcome!  I'm glad that did it.  The alert can be deleted, it was just added for troubleshooting earlier.

I'll take a look at the other question.  Hopefully I can redeem myself but it is even later now. :D

Thanks for the grade, the points and the fun question.

bol
0

Featured Post

Receive 1:1 tech help

Solve your biggest tech problems alongside global tech experts with 1:1 help.

  • 8
  • 8
Tackle projects and never again get stuck behind a technical roadblock.
Join Now