Multi part forms with Javascript
12th August 2003
Andy Arikawa has a nice demonstration showing how multi page forms can be served up as a single page using some simple Javascript, resulting in a clearer form without loading times in between each page.
The concept is great, but the execution has a some subtle flaws—the most important of which is that browsers with Javascript support turned off (but CSS turned on) will not be able to use the form. The culprit is the use of a style="display: none;"
attribute on the two divs that should initially be hidden. CSS supporting browsers will follow this rule blindly, even if Javascript is disabled and they will thus be unable to later reveal the hidden page content. The solution is to have all of the elements visible initially, then hide them with a piece of Javascript that executes when the page has loaded.
My other small gripe is the use of javascript: in the href part of the links to activate the toggle function. Dive Into Accessibility has the skinny on why this is a bad idea. Since the toggle links lead to other sections of the form, it makes sense to use the IDs of those sections as the link so that browsers without javascript will still “jump” to the section that is linked to. The Javascript itself can be placed in an onclick attribute (and duplicated in an onkeypress attribute for improved accessibility).
Taking the above points in to account, here’s a reworked version of Andy’s demonstration that should work just fine in browsers with Javascript support disabled.
More recent articles
- Weeknotes: Llama 3, AI for Data Journalism, llm-evals and datasette-secrets - 23rd April 2024
- Options for accessing Llama 3 from the terminal using LLM - 22nd April 2024
- AI for Data Journalism: demonstrating what we can do with this stuff right now - 17th April 2024
- Three major LLM releases in 24 hours (plus weeknotes) - 10th April 2024
- Building files-to-prompt entirely using Claude 3 Opus - 8th April 2024
- Running OCR against PDFs and images directly in your browser - 30th March 2024
- llm cmd undo last git commit - a new plugin for LLM - 26th March 2024
- Building and testing C extensions for SQLite with ChatGPT Code Interpreter - 23rd March 2024
- Claude and ChatGPT for ad-hoc sidequests - 22nd March 2024
- Weeknotes: the aftermath of NICAR - 16th March 2024