Internet Bandaid   [RSS Feed]

Accordion Forms – Dangers

without comments

You’ve seen those accordion forms? You know how a form is broken up into multiple sections. You see section one, and after filling it out, it slides up and the second section slides down, etc…

Whenever you build an accordion form, careful consideration should be paid to validation. You definitely need BOTH server side validation to protect the database and client side validation to assist the user in filling out the appropriate values. You can’t do with just one and not the other. Why? Because:

a) if you stick with only server side validation to protect the database, it means that on failure, you will need to reload the page with the appropriate accordion step open. The tricky part is writing code to open the appropriate accordion step. I’ve seen developers set “flags” to determine which accordion step shoudl eb opened upon failure. This can get very messy especially if multiple sections need to open, in which case, defeats the whole purpose of having an accordion. Your controller code will bloat up like crazy …you’ll wish your accordion was just broken up into multiple pages instead, with the controller code decoupled between each step. When doing server side validation on accordion form, if you rely on reloading a form upon failed validation and showing error messages, that’s a clear indiction you should not be using accordion form.

b) if you stick with only client side validation, so that you can validate within each accordion step, sure it’s great for the user, but hackers can easily disable javascript, and start attacking your system. Or even more likely, the client is on a browser that has poor support for certain javascript features.

In conclusion, if you use an accordion, be expected to do A LOT more work. It’s not as simple as just picking a jquery plugin and slapping it to your projet. Be prepared to double up your validation work.

If you’re on a tight timeline, keep each step that normally appears in an accordion section as their own page. Then it’s very clear what each page is for, instead of one massive controller trying to manage too many accordion steps.

Written by John Lai

January 22nd, 2014 at 1:21 am

Posted in Uncategorized

Start Mission - Project management and invoicing

Leave a Reply