Form Validation - PHP versus Javascript

[FCC]

Hey guys,

I was just wondering, what is the general consensus on which programming lanugage to use when validating forms? I am more familiar with PHP than Javacript so I would like to use PHP, but I've seen more Javascript form validation tutorials than PHP.

Is it worth the time to go in more depth with Javascript or is PHP sufficient enough if not better?

[Tyssen]

JS pros: the user is alerted instantly that there's a problem and doesn't have to wait for the page to reload.
JS cons: if the user has js disabled, your error trapping fails so you need a fallback if that happens which probably means server side validation.

[FCC]

Ahh I see, so Javascript can be used for the server side, and then PHP can be used for the client side....

Is the general approach to use both languages?

[rjm1982]

There are reasons for both, but heres how i generally look at it

I use javascript. I pretty much know PHP inside and out, and its much easier to validate in php...but heres why I use javascript.

With javascript, if the user has a problem, its shown right there. They can fix it, and they lose none of their entered information. If you let it post, then they will lost it (unless you echo out what they had posted back into values...which is more code) ...

SO either of those work...and with the PHP you could more easily make a nice error message. So why, say you, use JS, still?

That damned refresh button, thats why. If they hit refresh, not only do you get the security warning, which is bad for the user experience, you stand the chance of duplicate or orphaned data.

When i handle a post, i never just display a page without a redirect, even if its just back to $PHP_SELF...that will clear the post in the browser and prevent duplicate data chances.

I actually often use both. I use javascript to check it first, then php checks to prevent bad data if the user doesnt have JS enabled and cant read the form instructions... and when that happens, i DO reprint my form without any redirect, and fill the values with the post values.

In the end, it takes more code, but it DOES provide the best user experience...which is kinda funny, because your smart, deserving users will never notice, just the dumb ones

[cranial-bore]

which is kinda funny, because your smart, deserving users will never notice, just the dumb ones

Never thought about it like that, but so true. Maybe we should aim for really bad user experiences for those that don't read form instructions to teach them how to behave

[FCC]

In the end, it takes more code, but it DOES provide the best user experience...which is kinda funny, because your smart, deserving users will never notice, just the dumb ones

Haha, that is quite ironic isn't it? All I am convinced by your argument. Now, can you direct me an excellent Javascript tutorial which won't lead me around in circles? I know very little about javascript by the way.

[Viflux]

I think it best to use a combination of JS and PHP. You can never be too safe

[phileplanet]

What functions do you use for form validation? (More specifically email)

[rjm1982]

Here is my javascript (in an external js file of course...dont clutter up your page)

function isValidEmail(p_strEmail) {
	var regexp = /^\S+\@[a-zA-Z0-9\.-]+\.[a-zA-Z0-9]{2,4}$/;
	return regexp.test(p_strEmail);
}

function isValidURL(p_URL) {
	var regexp = /^http\:\/\//;
	return regexp.test(p_URL);
}

function validateForm(frm) {

	if (frm.NAME.value == '') { alert('Please enter your first name.'); frm.NAME.focus(); return false; }
	if (frm.NAME_LAST.value == '') { alert('Please enter your last name.'); frm.NAME_LAST.focus(); return false; }
	if (!isValidEmail(frm.EMAIL.value)) { alert('Please enter a valid e-mail address.'); frm.EMAIL.focus(); return false; }
	if (frm.STREET.value == '') { alert('Please enter your street address.'); frm.STREET.focus(); return false; }
	if (frm.CITY.value == '') { alert('Please enter your city.'); frm.CITY.focus(); return false; }
	if (frm.STATE.value == '') { alert('Please enter your state.'); frm.STATE.focus(); return false; }
	if (frm.ZIP.value == '') { alert('Please enter your zip code.'); frm.ZIP.focus(); return false; }
	
	if (frm.MONTH.selectedIndex == 0 && frm.DAY.selectedIndex == 0 && frm.YEAR.selectedIndex == 0) {
		alert('Please enter your birthday.');
		return false;
	}
	
	if (frm.URL1.value == 'http://' || !isValidURL(frm.URL1.value)) { alert('Please enter the URL  (with a leading http://).'); frm.URL1.focus(); return false; }
	
			
	return true;
}

Now, just call it from your form...like so:

<form name="frmMain" action="x.php" method="post" onsubmit="return validateForm(this);">

If it fails, it will give an alert, focus on the erronous field, and return false...

What makes it handy, is by using "return <function>" we control whether to submit or not, if it returns false, then onsubmit returns false, which will stop the submit.

[FCC]

Good stuff.

Ok I tried to do some PHP form handling and I have a lot more trouble than I expected....does anyone know of a good tutorial which walks through the whole form validating process using PHP

[rjm1982]

In php, I never get complicated with it...

I generally jsut check for data, not format, as the JS should catch that...and if your one of the few that cant read and dont have JS enabled...then your submission will be bad and its your problem for being -not so smart-

i typically use the following format

<?
if(!$_POST['TEXT1'] || !$_POST['TEXT2'] || !$_POST['TEXT3'] || !$_POST['TEXT4']) {
     //throw message
     //if wanted, reprint form WITHOUT a redirect using the $_POST values to populate it.
}
?>

*note - When you do this, you have to be wary of zero values, if your using a checkbox/radio where one has a value of zero, then that will fail this simple test (! == 0) , for those, you need to use isset, isset actually checks for the existence of it, and wont fail on a set 0 value...(this also applies to textboxes that the use may enter 0 in as a valid, logical answer)

if(!isset($_POST['RADIO1'])) {
     //we failed....
} 

[JakeJeck]

asp.net does both for you

[rjm1982]

I would rather take 5 minutes of time and setup my own code, so i can modify it and/or tweak it as needed each project without having to worry about proprietary code...plus most clients are willing to pay for .net server licenses...when you're dealing with big companies, your dealing with dedicated servers, not shared hosts, so typically whatever server software you use has to be either freee (gpl) or paid for...I would personally rather take some of the money they would have spent on .ner for myself...

[brandaggio]

Good stuff.

Ok I tried to do some PHP form handling and I have a lot more trouble than I expected....does anyone know of a good tutorial which walks through the whole form validating process using PHP

PHP is far from my forte. As such I looked for PHP script that I could use for form handling.

Although it has its limits, I find that Dynaform is suitable for most simple forms that don't require writing to a DB - meaning it is perfect if all you require is an email with the form results.