在表单提交上发送错误/成功消息的路由

Question

I'm trying to make my contact form submission process work equally well whether the client has javascipt enabled or not.

If javascript is enabled, then validation will be handled client-side when an onsubmit event is triggered which calls my validateContactForm() function:

<form method="POST" action="email_processing.php" onsubmit="return validateContactForm();">

If false is returned, then the form isn't submitted and the client is directed to correct what he has done wrong.

The form is submitted to the email_processing.php script on if true is returned by validateContactForm() or if javascript is disabled. The php script then revalidates the data and if everything is OK, it sends an email.

If I were relying on javascript, I could have made this process asynchronous and just have the php script return a message which would get handled by a callback function client-side. This would either be an error message or a success message.

But because I want to make this work for people with javascript disabled, I can't do that.

If there's an error, I need to return the contact form page with error messages displayed in the contact form and if it's been a success I should maybe get rid of the contact form and just display a "thanks" message where the form used to be.

I'd be interested to know whether stackoverflow users would:

1. Submit the form to a php script which would then redirect to a different php / html page.

2. Have the validation / email sending functions at the top of the contact us php page itself and each time the contact us page is loaded we check to see if certains variables have been set and if so then we know that we need to validate and send the emails and display the correct format / message.

3. If I should be thinking about this differently. This must be a very common situation to handle and I have done it many times in lttle applications for myself where I knew that I would have javascript enabled, but I need to do this for a client and I want to make sure that it's done right.

Many thanks in advance

Answer 1

Here is what I do. first I use jQuery validate (thats just how I validate) and errors will show if there are any and won't let the user continue without validation

then then I send form submission using jQuery ajax when it hits the server I also do a double check with php this allows me double protection and errors are sent back

if users don't have javascript enabled when the form is submitted validation is done errors messages are displayed

HTH

Answer 2

It indeed is a very common situation to handle.

So you have two kinds of validation: Client-side and server-side. Server-side is the most important, and I view client-side validation of more as a feature. For example if you're filling out a form, it's "nice" to see whether it's filled out correctly without actually sending the request, but you should still do server-side validation for security reasons.

You'll want to do a server-side validation always, but it's actually better to do both. Here's how you should design it:

The form action should send the user to the .php-file. If the content is validated, good, give him an ok message. If the content isn't validated, send him back to the form page and display an error message.

If you're looking for a less abstract solution let me know.