Building a large form, need advice

Question

I have to build a large form for users to fill out in order to apply for graduate study at the college I work for. There will be a large amount of information to collect (multiple addresses, personal information, business information, past school information, experience, etc...) and I want to know the best way to handle all this. I'm going to be using PHP and Javascript.

Are there any helpers or pieces of frameworks that I can use to help with the building/validation of the form, something I can just pop into my existing project?

Also would like any advice as far as keeping track of a large form and the resulting data.

Answer 1

You need to use multiple pages, and you need to include a mechanism whereby users can leave, and come back and fill out the rest of the form later (or if they're accidentally disconnected). Otherwise you're going to have all sorts of user issues, not due to your service, but because they're using computers and internet connections that are flaky, etc.

Survey software is probably a reasonable approximation of what you're doing, and there are survey packages for most PHP CMS's. Are you building this from scratch, or do you have an existing CMS underneath?

Answer 2

A List Apart have an article on building sensible forms that is a good read

Why does the form need to be large on the first instance? Can't you trim it down to the bare essentials for the account and provide a way for them to come back later to flesh out the rest of the details?

For form validation, pop a gander on the jQuery validation plugin, Validation

Answer 3

A few tips, without knowing all the specifics of your form:

Don't show the user everything at once - this can be accomplished by multiple pages, or by selectively showing/hiding elements on the form as the user progresses through it. Provide contextual navigation that says "You're on step 3 of 10" so the user can get a sense of where they are in the form and how much effort is required to finish it.

Providing a mechanism to save and return later is a fantastic idea. If possible, provide a link to an email account of their choosing - you want to make this component as easy to use as possible, and requiring them to fill out an additional username/password to retrieve their data is just another barrier to completion.

Only ask for what you absolutely need. Yes, you're going to have to fight some political battles here - everyone wants as much as they can get. One way to combat this (especially effective when you have pressure from multiple groups) is to build out some prototypes: 1 with EVERYTHING and one with several sections reduced or removed. Have stakeholders from each group fill out both of them and measure their time to completion or roll-throughput yield. When you've got completion data, and they realize how much every other group is asking for (in addition to their group) they are easier to work with. In short, remove as much as possible - let the user go back later to provide more details if they wish.

Write down all your inputs on index cards and see how they logically fit together. More often than not you will find more efficient groupings or orderings. More than likely you will come up with much more usable ideas. This is extremely important when converting paper forms to online forms. Usability.gov has a fantastic case study on this topic.

Answer 4

Well I agree with Adam but I have some advise for you.

If I were you, I would create some virtual hidden tabs instaed of multiple forms with a next button. You can create some which can control by javascript. First show the first one which will collect personal information like Name,Birthday,email, and etc... . Once user filled them out and clicked on next button,hid this and show the other which will ask for other information like address and so on.

Once the whole dive compeleted, at the last div put a submit button which will submite the whole information to the server at once.

By why do so?

1. User will not get shocked becuase will not see a long form at each time and will fill out with patient.

2. You hit server at once;usually universtites and college's servers are too busy, you better design a form which hit the server least. This could count as performance tip.

3. Since you will submit the whole data at once, you would not worry about the issue that user will continue to fill out the other pages or not,so you will use less session which still will count as a performance tip.

4. This way makes your form more interesting and you can called you did something like Ajax.

Answer 5

You can add Javascript form validation to make it more user-friendly, but one thing you should never skimp on is the server-side validation... which has historically been awful in PHP.

One thing that'll make your life a million times easier here is the filter library, especially filter_input_array() since you can build the input validation programmatically instead of having to copy and paste a lot of checks. It takes some getting used to, but it's much, much better than the old way of doing things.