NiceForms with even nicer select September 11, 2005

Posted by Slobodan Kovacevic in : Programming , 31 comments

UPDATE 31-Jan-2007: There’s a new version of Niceforms. For more info see this post.

Few months ago I stumbled upon a great piece of JavaScript called NiceForms by Lucian Slatineanu. The idea of script is to replace all form elements with visually much nicer and more controllable elements. Great thing about it is that it replaces all form elements automatically, meaning that you don’t need to make any changes to your form. As a consequence if JavaScript is turned off it just degrade to ordinary form.

NiceForms still has some problems - for example with accessibility such as tab element switching, with changing text size manually in FireFox, etc. (for more info visit Lucian’s site).

One particular problem it has is with select elements:

- You can only open select by clicking on right arrow
- It doesn’t close automatically (i.e. when you click somewhere else), you either need to select an option or click right arrow again. This can create some strange effects, for example you can have more then one drop down option list open at the time.
- When first loaded it has some default text instead of currently selected option, which can lead to problems if you have pre-selected an option in HTML.

So, I had some time and decided to try to fix this. Hopefully these fixes will be included in following versions.

If you don’t want to read all the details you can just see modified NiceForms in action or download a ZIP containing the whole modified NiceForms example.

If you want to read everything, then here is what I did…
(more…)