Validate a form using PHP and JavaScript?
Can I validate a form using PHP and JavaScript ? Currently I can use both existing ones form
, but only on an individual basis.
My overall goal is this:
- Submit the form using JavaScript client-side and notify users immediately.
- If the JavaScript validation passes, a flag is generated and then a PHP script can start .
When doing my JavaScript validation, I am using the following code in the tag form
:
<form id="Enroll_Form" action="review.php" method="post" name="Enroll_Form" onsubmit="return Enroll_Form_Validator(this)" language="javascript">
If I want to handle PHP validation , I am forced to rename the action to file PHP_SELF
(or just the same filename that I am using), and remove the 'onsubmit' function.
a source to share
UPDATED in the comments to the comments
First of all, for obvious reasons, javascript cannot be a safe validator! it might be a fancy way of displaying alerts and notifications, but it's just sugar!
Valid validation must be done in PHP or another language on the server side and also on the database side by validating and formatting the values!
This simple script is just a demonstration of how you can build a smart validator, but of course it's just a proof of concept!
DEMO: http://jsbin.com/aceze/29
$(function() {
$('#myform').submit(function() {
var error = false; // flag
$('.email,.digits,.empty,.some').each(function() {
var check = this.className;
if (check == 'empty') if (!checkEmpty(this.value)) error = true;
if (check == 'digits') if (!checkDigits(this.value)) error = true;
if (check == 'email') if (!checkEmail(this.value)) error = true;
if (check == 'some') if (!checkSome(this.value)) error = true;
if (error) {
$(this).css('border', '1px solid red');
} else {
$(this).css('border', '1px solid green');
}
});
if (error) {
return false;
}
});
});
Then in relation to the action, <form>
you don't need to have the path to the php page, but you have to use AJAX for the POST OR to just leave review.php
where the following snippets are below:
// FIRST SNIPPET action="#"
if ( error == false ) {
//if all is ok give our form it php
$(this).attr('action','review.php');
} else {
// error
// place false here so the form don't submit if validation fail!
return false;
}
// SECOND SNIPPET action="review.php"
if ( error == true ) {
// form submit only if validation pass
return false;
}
// THIRD SNIPPET action="#" AJAX
if ( error == false ) {
// success
} else {
// error
}
// this false prevent the form submit in anycase, cause we use AJAX
return false;
a source to share
I don't really understand what the problem is, if your action onsubmit
returns false
in the case of a non-validated (javascript) validated form, the form just isn't submitted if javascript is enabled.
Once the form is submitted php can do whatever it wants to, validate, return errors, etc.
a source to share
I have not tried this, but from head to toe; you don't need it language="JavaScript"
in your form to use the event handler onsumbit
. If this event evaluates to true
, the form will be submitted as normal (so PHP will see it and be able to validate it).
It's good to see that you are not relying on client side validation. It is trivial to disable JavaScript in the browser. You always need to check one input.
a source to share
Don't rely too much on JS for this kind of thing. Yes, you can check to prevent user errors, but someone can easily create .html
and do
<form action="http://yoursite.com/review.php" method="post">
<input type="submit">
</form>
And bypass any JS validation you have. Validate in PHP just as if you had no JS validation at all.
a source to share