1

I am a total JavaScript noob, but I have been searching for a solution for quite some time now and can't seem to find it.

What I want to do is: Before sending a form, check if the entered e-mail address is valid and also check if the input of the phone field starts with http://.

Validating the e-mail address is working like a charm. However, the second part isn't. The form is just sent without any alert or anything.

Can someone enlighten me? Thank you!

function validate(){ var email = document.getElementById('email').value; var phone = document.getElementById('phone').value; var filter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/; if (!filter.test(email)) { alert('Please enter a valid e-mail address.'); return false; } else if (phone.StartsWith("http://")) { alert('Please correct your phone number.'); return false; } }

For anyone wondering: this is supposed to be a "simple" spam blocker.

Maybe it would be even more interesting if the phone field was checked for any characters except numbers, plus, spaces, hyphens and dots...

What do you think?

Improve this question

2 Answers 2

Reset to default
4

First to answer your question:

Edit: Nowadays JavaScript does have a startsWith function on the String object.

JavaScript does not have a 'StartsWith' method on the String object. You will have to use regular expressions for this. Here's an example:

function validate() { var email = document.getElementById('email').value; var phone = document.getElementById('phone').value; var emailFilter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/; var phoneFilter = /^http:\/\//; if (!emailFilter.test(email)) { alert('Please enter a valid e-mail address.'); return false; } if (!phoneFilter.test(phone)) { alert('Please correct your phone number.'); return false; } return true; }

I created a jsfiddle to show you how it works: http://jsfiddle.net/cnVQe/1/

However: it's best to use a declarative instead of a programmatic approach for validating forms. There are many tools that do this. One of them is this jQuery library that does most of the heavy listing for you: http://jqueryvalidation.org/

It works by just adding classes to to the fields and have the plugin do the checking , error displaying and preventing of form submission.

Just to add: you approach is not wrong, but if the form gets bigger and you want to check more fields you will inevitably run into complexity that has been solved over and over by other people. Even if it means that you pull in additional complexity with the extra plugin it will all be worth it as soon as you start to make the form bigger.

Also: your regular expression for the e-mail address check will not accept the + sign, which is something many people use to create special gmail accounts like [email protected]. Using libraries such as the one I describes very often have robust checks already. So that's an additional benefit on using existing libraries.

Improve this answer
Sign up to request clarification or add additional context in comments.

7 Comments

Thank you, I will definitely have a look at that! Nevertheless, I would really like to know what is wrong with "my" code for it to not be working... I tried to put the else if into the if, but to no avail.
Thank you again... I admit that I am kind of confused now, though.. Is there something wrong with your jsfiddle?
I added the wrong URL for the jsfiddle. I changed it to the correct one. Seeing that you are new to the site I'd like to add that if you think my tip was helpful then upvote it and mark it as the correct answer. People that reward helpful answers get more help when they ask future questions on stackoverflow. Cheers.
Hello and thank you again. Seems to be working perfectly now, very appreciated. I will still, of course, dive through the links all of you gave me and try to memorize those approaches for future cases. Thank you!
Based on Larry Battle's answer here I just did this: var phoneFilter = /(http:\/\/)|(www)/;... it seems to be working OK, did I do it right? :)
|
1

You need a phone number checker function to be sure that the number is correct. Here it goes : http://www.w3resource.com/javascript/form/phone-no-validation.php

Improve this answer

1 Comment

Thank you, I will certainly keep that link in mind for future reference. However, in this case, I would like to check what a specific fields starts with, so that I can apply this to other fields as well.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.