In this assignment you will:
- Continue practice handling various Javascript events by writing dynamic event handlers.
- Use Javascript commands perform form validation.
The guidelines for allowed and disallowed resources are the same as given in
homework 5.
If you haven't done so already. Complete your lab day work. Your final form
should:
- Provide error messages on the form itself when the form is submitted
(when error messages are needed).
- If there are not error messages the form should submit normally. If there
are errors the form should not submit.
- The form should display all appopriate error messages when applicable and
should not ever display error messages when not applicable.
- Add Radio Buttons to Your Form
- Continuing working on the form in
poemlayout.html. Add a form element to the form called “Poet Rating”
that will provide a set of radio buttons that will allow the poet to rate
themselves as one of the following: Beginner, Intermediate, Advanced. The
buttons should be attratively arranged and labeled in accordance with your
color scheme.
- Modify the Poem Type Dropdown
- It is common, when creating a drop-down
select box to have the first option provide instructions rather than be a
valid entry. One reason for this is that sometimes you don't want to have
a “default” value, but rather to know that the user has explicitly
chosen something. In this case, the first/default entry should say
something like: “Select Poem Type ...”.
- Validate All Form Elements
- Using the same techniques as from the lab
day exercise, continue adding form validation to the form as follows:
- Verify that exactly one radio button in the Poet Rating has been
selected. Radio buttons can be a hassle to work with. Rather than
checking each one individually based on its id value you can use one
of the ideas here to check it more efficiently:
https://stackoverflow.com/questions/1423777/how-can-i-check-whether-a-radio-button-is-selected-with-javascript
- Verify that one of the poem types (not ”Select Poem Type ...")
has been selected.
- The Poem Title should be trimmed of trailing and leading
whitespace and can contain and characters and should have at least 3
characters.
- The Poem itself should also be trimmed and should contain at
least 10 characters with no restriction on the types of characters.
The error messages should use the same styling and methodology as prescribed in
the lab day exercise. Commit your work and push it to bitbucket.
If you haven't done so already, copy the most recent version of your personal
site into the hw07 directory. Now use the same techniques to add
trimming, validation, and well-formed error messages to the form on your
personal site.
Commit your work and push it to bitbucket.