I have a fairly complex form with lots of questions. There are many required fields with script letting user know that they need to complete the specific field. The fields also have a tab order.
To URL for the form is:
https://www.innerbalancehealthcenter.com/assessment_form.htm
The layout is poor with nested tables. Initially, there were only a dozen questions but we kept adding on and it is quite messy.
The validation stopped working in IE 8.
Here is what I’m now looking for:
- Clean up overall code and eliminate erroneous tags.
- Move name/address fields to the left more. Right now they are on the right side of the main section and too much white space on the left.
- This is the main change… I would like to make the required field validation more Ajax based or at least validated where the field is located. For instance, if first name is required and the user submits the form without a First Name, then there is some text near the first name field in red italics that says something like “You must include your first name”
- Finally, there are several conditional fields I need to make required. For instance a question with a radio button has a “yes” or “no” response. If the user picks yes, then the 3 fields after are required. If they pick “no” then the next 3 fields can be left blank. An example is:
7. Have you ever been to treatment before? []no []yes
If yes, Name of program [ ], type of program[ ], dates attended from[ ] to[ ]
Question #7 is required. If they answer “No” the related fields can be left blank. But if they answer “Yes” then they need to complete the related fields.
- finally, I need good commenting in the code. We constantly change this form with new questions, new required fields, etc. and need to be able to do this ourselves.
- the layout in the footer looks broken and shows a white background at the very bottom below the footer and should be gray. See other pages on site to see how the footer should look.
This form feeds our formtools database which we like. I’m just looking to clean up this form, improve the validation (located next to and highlights missing required fields), create conditional validation (if yes, then…), fix the layout and well commented code to facilitate future changes.
The current code shows all the required fields. However, these are the conditional fields we would like added:
6a. If 6a contains text, following 4 fields are required.
6b. If 6b contains text, following 4 fields are required.
6c. If 6c contains text, following 4 fields are required.
7. If yes, next 4 fields are required and #8 and #9
If 2nd Name of Program contains text, other 3 fields required and #10, #11
If 3rd Name of Program contains text, other 3 fields required and #12, #13
#14 if yes, 14b
#15 if yes, 15b, 15c, 15d, 15e, 15f, 15g
#16a if yes, 16b, 16c required
#17a if yes, 17b, 17c required
#19a if yes, 19b required
#20a if yes, 20b required
#21a if yes, 21b, 21c required
#22a if yes, 22b required
#23a if yes, 23b required
#39a if yes, 39b required
Open to new ways to accomplish this. Just looking for an elegant and user friendly form in the end.
