Form Validation With Js/Jquery & PHP - php

I'm building up a site that utilizes a lot of forms and before I decide on what 'standard' I want to use for most of my form validation, I would like to know what makes the most sense:
Should I validate forms on the front end with js/jquery?
Should I validate forms on the back end (server side) with Php?
Or should I validate on both sides?
I think validating on both sides makes the most sense in terms of security, but my worry is that the site might not be scalable if I try to process too much validation (e.g. is there such thing as too much redundancy with validation especially if I have pretty complex forms with 20-50 fields?)
Thanks

You should validate on both front end and back end. Front end validation will not affect your sites scalability badly because the processing is done in the client's browser. In fact front end (client side) validation will help in scaling as it saves precious bandwidth and server side processing.
You should never ever leave out server side validation, as client side validation can be tampered by a malicious user.
So you should use both.

I would validate on both ends, javascript/jquery will look nice for the user, but can be turned off, you don't want the user able to turn off all validation, so check it on the back end as well.

I say both sides. Client side so the user doesn't have to refresh/submit the page before knowing something is wrong. But client-side is easy to edit/remove from the page entirely. You should never rely on it and always do server-side validation.

yes i would also recomend both sides to avoid something you don't want

Related

What validation is better to practice - Server-side or Client side validation?

I am making a new system and wanted to know what kind of validations to use for a more convenient coding and a secure system.
Should I use Server-side or Client side validation?
You absolutely need server side validation as the client can't force data in with it in place.
Client side is optional, as without it bad data still gets caught via post back. With it, you can warn the user faster that there is an issue.
There's a pessimistic theme I meant to mention - never trust the user. Either they're going to make a mistake, or they're out to break your app.
I will go with both sides validation. As both have there separate significance.
If you just put the validation only on client side then someone can make your life miserable. And if you just put server side validation then for any error every time client have to fill complete data to server and then only he/she will be able to know the error. So if you just show the error right there just by clicking then it will be good for both of you as you don't have to handle erroneous data every time.
I second, 'The1nk' points. But one additional point is we have to support the user in-terms of fast-responds for mistakes and purposeful attempts, thus the client-side validation is effective.
Definitely you must go with the Server-side validation and for client side validations, just like in the past you are not required to go with the hard-coded Javascript validations (though can go for complex data validations). If you wanted to use some simple validation there are many features available in HTML 5 which you can use like below,
Must required text fields: add html input attribute 'required' (note: no value for this attribute)
Specific types text fields: there are lots of different types of 'type' attribute values are added in HTML 5 like email, number, date, etc... can use them to validate those fields (there are additional attributes also available for those input types, for example for number min and max attributes)
Some useful links
HTML form input types
HTML form attributes
Since this is pure HTML the long term concern (What if the user disable the JS in browser?) with JS can be somewhat addressed. But, Keep in mind "There are NO Silver Bullet in Software Engineering" - Fred Brooks.

Why server-side script is better when making a contact form?

I searched over the web and I found that a lot of people say that server-side script is better when making a contact form for a website... Can someone tell me why, please?
In my little experience I appreciate when a contact form is able to hightlight istantly when I wrote a wrong email, or a field is missing, rather than waiting for the answer of the server after processing the input in a php page. Maybe is better to implement both jquery validating and server-side validating?
They must be talking about the form validation. Client side validation is usually done with JavaScript/jQuery which can be easily manipulated using tools like Firebug. If user disables his JavaScript, the validation will fail and wrong data will be posted, inorder to prevent that, Server Side Validation is used for example, PHP, ASP.
The data is posted to the server, server validates the data, if it's incorrect, it will throw back the error to the user, and the most important is that server side validation cannot be manipulated/modified easily.
Now you may ask why to validate Client Side if it can be modified/broken easily? Well, not everyone is intelligent to fool your validation, home/normal users often forget some fields to fill up which are compulsory, if you do not keep a client side check at all, your server will get more and more requests directly, thus increasing the load, inorder to prevent that, you need to keep a client side check as well, which will prevent the form details to be posted to the server directly, thus decreasing the server load.
Also, it will save the time for your users, JavaScript validations are very quick, the users are responded with the related error messages when they are typing, or they move to the next field or very soon after the submit button is pressed. Where as server validation will make the process lengthy as forms will be submitted first, server will validate, and than it will return the message. Not much friendly for an user huh?
So the bottom line is validate both, Client Side and Server Side, but make sure you DO VALIDATE Server Side.
If you use client side languges like javascript or jquery for validation then modern browsers have the option to turn off or disable javscript and if they do so then validations will not work.But its not applicable in the case of server side validations.You can refer these links for more
http://www.dzyngiri.com/client-side-vs-server-side-validation/
JavaScript: client-side vs. server-side validation
You can perform sending and validating on server side but you can also provide basic validation on client side. Thanks to that you can notify user when something is wrong instantly. But also you will be sure that all data is correct (because of server side validation).

Validating Form Input Client-side (JS) Vs Server-side

I'm making a form in a server using PHP, but I'm considering on using jQuery for the form submittion.
So, what option is better? A PHP script that takes the form, validating stuff right there and sending messages when something is wrong, or a jQuery script that sends the form without reloading? What are the pros and cons? Thank you beforehand!
You should do both!
Server side validation is always more secure then on client site.
Client site validation is great for the usability because the user will get an instant feedback from the script if something went wrong. And the user don't have to send the data to the server first before he gets some feedback.
I always put the validation on the server-side at a minimum as client-side logic is ultimately unreliable (what happens if someone disables javascript? Opens firebug to change things?). I treat client-side validation as a bonus for UX. That's not to say you can't use something like the jQuery validate plugin to add client-side logic on top of it, but I wouldn't rely only on client-side logic.
I've found myself becoming fond of the MVC famework from Microsoft because version 3 has very nice integration between the server-side validation logic and the jQuery validate plugin. Haven't looked in a while but there might be something like that in a PHP framework?
Never trust the client. Thus, JavaScript form validation can only be a plus, for user convenience, but never be your only validation mechanism. With a bit of webdev knowledge you can work around JavaScript and send forms with data you like.
JavaScript validation with informative messages can be a huge plus for users though, so you should definitely consider it as a user-level validation.
Also, remember there may be users who do not use JavaScript by default.
I use both. For a validation example.. I will have a php function called "saveData()" and it would throw an exception if its missing some form data. On the other hand, if they have javascript enabled, they can submit the form and immediately find out if they are missing data, rather than reloading the page to find out.
Assuming you mean to use javascript to validate and then send it serverside (which, as #pekka says, is a given), then you have as pro/con for jQuery/javascript this
pro:
quick and easy validation. You can do this per-field, not everything at once.
con:
some people still don't like extra/unneccesairy javascript in their pages. But i don't think that's a big con.
Client side validation has nothing to do with security.
Its purpose is only to improve performance to create a better user experience.
Server side validation is all about security.
Any client side validation must be done on the server side (the other way around is not a must).

Why should you validate forms using javascript?

What is the point in validating your HTML forms using Javascript, if you are always going to need to validate the forms using PHP anyway? I realize that you get a speed boost from this, and its more convenient to the user, but beyond that, is the time spent on it worth it? If anyone has any good evidence on this I would love to hear it.
Thanks for any help!Metropolis
UPDATE
After receiving numerous answers I would like to change the question a little. We all know that javascript is much more convenient for the user and it gives faster feedback. What I am wondering is: Has anyone ever seen any "evidence" that its worth it? Or do we just do it because it makes things a little better and everyone says we should? The speed difference is not that significant, and as the internet gets faster javascript validation will become even more obsolete I would think.
I am starting to wonder if the time spent validating a page using javascript could be better spent.
Ideally, you validate through javascript and (in your case) PHP.
Both validation methods will work in-tandem to ensure you get the most robust and user friendly functionality possible for your end user.
You will use client-side validation to ensure that all fields are filled in, email addresses are valid, etc.. this will provide instant feedback and won't burden your servers or the user's internet connection.
you validate server-side for security. You can control everything on the server and nothing on the client machine. It's here that you ensure that all entered data is non-malicious and correct.
Keep this in mind: if you are only going to go with one type of validation, choose server-side validation because it is more secure. You should never rely on client-side code for any kind of security.
Using both types of validation gives you the best of both worlds (responsiveness and security) while having none of the downsides. Of course, this means you have to write more code, but in my opinion, it's worth it.
EDIT: In response to the comments
Yes, you have to write more code this way... As a rule of thumb, if it's harder for the programmer, it's easier on the user. It might not make sense in some budgets to do both types of validation and that's a call you're going to have to make. Just make sure your server side validation is rock-solid regardless.
Yes, time is money, and time invested in improving the user's experience is time well spent. If you can't afford to do it now (deadlines/schedule/budget) then do it when you can.
It's all about usability. It is much more convenient for the user to read what errors they have made before the page reloads, rather than continuously submit and reload the page. It can also give a nicer look with some AJAX and the likes, rather than a reload of the page and the very ugly looking red error messages, I think. So the advantage? Much more usable than having server side validation alone.
To provide a better user experience.
The feedback on JS validation is faster, and therefore better than server-side validation on form submit.
The main point of JavaScript validation (when available) is that it improves the user experience. A round-trip to the server requires a page load and the associated annoying flicker as it redraws. Validating in JavaScript code allows you to display a message without all that.
That being said, server-side validation is still required since JavaScript isn't always available (NoScript is quite popular) and because a malicious user will bypass the JavaScript.
Particularly for database backed websites, it tends to be that you need to do server side validation anyway. e.g. to make sure you're inputting valid data into a database or other system. Depending on what the website is updating this could be absolutely critical.
However, client side validation can provide a better user experience. It can be used to provide instant feedback. e.g. when you move focus away from a text box a validator can provide instant feedback which is great when you're filling in a long complicated form.
The bottom line is that you will still need to input good data into your database. And the more correct the information stored in there, the less problems with the system you'll have later. You need both.
e.g. What if someone updates the website code in the future and breaks the validation? or someone writes a script to automate inputting data, bypassing your web front end all it's validation?
I'll say it again. You need both.
...i think you're also keeping your karma cleaner, when hundreds or thousands of your users don't wish you burn in hell for making them fill in 5-7 fields (with textarea) to be informed on the next page they mistyped their email so they have to start all over again :D
it doesn't eat up much of my time to incorporate javascript, id say 1-2 minutes maximum for 1 form. and it saves lots of nerve cells of my users. be a humanist! love ur neighbour!))
Client-side validation allows for an increased user experience. The feedback you give to the user leads to less frustration, less errors, more conversion, more money.
You generally have a better response rate with this kind of validation, which is very valuable.
An high quality software needs this. Users feels happy, and they will spread their joy. A user who has a bad experience won't come came and won't tell his friend.
It's not only decoration when you get to business and sales. ;) The return on investment is worth it.
Easy.
Javascript to help the user enter correctly formatted data.
PHP to make sure whatever enters your script gets cleansed before further processing.
Ofcourse you'll have to do both. Users want it, your customers want it and frankly, you think it's fugly getting php errormessages after submit aswell.
I don't think the argument of having to code extra .js which presumably would eat up your time/budget holds any thruth. There's so many libs and scripts outthere, either one will enable you setting up disco validation in no time at all. However, don't get carried away with dealing out eye candy. .js validation is just there to help. Not to impress.
PHP runs serverside, javascript runs clientside. You don't want your server crunching form validation when you can get the clients computer to do so. Plus it saves bandwidth.

form validation with javascript vs php

Why should I bother to use JavaScript for form validation when I still have to use PHP since the user could have JavaScript support turned off.
Isn't it unnecessary?
Update:
Ok thanks for your answers. it sounds like a good idea to have it on the client side too. where can I download good JavaScript validations?
Do you know where I can download a validation script like that one in yahoo when you register an account?
Javascript validation allows your user to be informed of any errors prior to their submitting the form to the server. This saves irritating page-reloads (since on submit the JS catches the event and validates the form, preventing form-submission if errors are found) and minimises the chances of their having to re-enter information again (and again and again...), or leaving prior to completing the form properly. JS validation is not a substitute for server-side validation (since the user can see the JS, and, by saving the page and amending the JS do whatever they want); but it's a convenience for them.
This is simply part of the concept of progressive enhancement, whereby JS provides a mechanism for enhancing the experience for the user, if it's there and turned on, and hopefully makes their interaction with your site pleasant, or, at least, minimally irritating.
Edited in response to OP's question regarding 'where to download a JS validation tool.'
While I can't -necessarily- recommend any one library (I tend to write my own as required, or borrow from previously self-written examples), a Google search threw these options up:
http://www.jsvalidate.com/
Stephen Walther's page, discussing Microsoft's CDN and jQuery-validation, linking to jQuery Validation plug-in:
jQuery.validate (hosted at MS' ajax.microsoft.com subdomain)
jQuery.validate.min
jQuery validate plug-in homepage (bassistance.de).
You should ALWAYS validate in PHP on the SERVER SIDE and validation in JavaScript is CLIENT SIDE validation for user CONVENIENCE. Thanks to validation on client user may find errors in his form without page relodaing. But user may sent form data without data script validation
(for example he may not have JS support in web browser), thus always validate on the server side.
... as courtesy to the users pretty much. Makes life easier for the ordinary users that simply commit human things from time to time.
I recommend you using unified server-side and client-side validation using a framework, since it may avoid confronting the user to data valid on client side but rejected by the server, or the opposite (client side too restrictive).
Following list of framework give information about server/client side validation:
http://en.wikipedia.org/wiki/Comparison_of_web_application_frameworks
It's a matter of whether you want your form (and website as a whole) to be interactive-cum-user-friendly or not. You can just let the server-side do the validations and throw the error back to the users but that would be less interactive and less user-friendly than warning the users before they submit the form (although you still need to validate the inputs on server-side no matter what). Just my 2 cents :P
I recomend to use Javascript for client side and Php for server side
This will make interaction or user friendly site nad reduce reloading page many times in case user submit wrong data
Yes, it is best practice to validate the user input values from both sides client and server side ,
some cases client was disabled javascript or mobile browser that doesn't javascript, remember there is spammers also.
To my mind, only client-side-checking of form input does not work because of security. Imagine you want to check a user password(if "yourpwd" == userinput), with js the user will see the password because it is in the browser-sourcecode .With php, it is not visible because php is for some reason hidden.

Categories