jQuery in Action
Putting events (and more) to work
123
Pork
</label>
<label>
<input type="radio" name="stickers.option"
value="vegetarian"/>
Vegetarian
</label>
</div>
</div>
<div></div>
</fieldset>
</body>
</html>
This code is robust in that it's independent of the number of appetizer entries.
You'll note that nowhere in the JavaScript is it necessary to tell the code what ele-
ments correspond to appetizer entries. The power of jQuery selectors allows us to
automatically locate them. New appetizer entries can be added at will--as long as
they follow the prescribed format--and the code will automatically instrument
them along with the previously existing entries.
You'll note that nowhere in the JavaScript is it necessary to tell the code what ele-
ments correspond to appetizer entries. The power of jQuery selectors allows us to
automatically locate them. New appetizer entries can be added at will--as long as
they follow the prescribed format--and the code will automatically instrument
them along with the previously existing entries.
In many ways, the code could stand some improvements. In the interest of
brevity and focusing on the lessons at hand, we took a number of shortcuts that
should be fixed before putting any such code into production. The following list
details some areas for improvement (or even blatant shortcomings of the code)
that you're encouraged to explore as exercises:
should be fixed before putting any such code into production. The following list
details some areas for improvement (or even blatant shortcomings of the code)
that you're encouraged to explore as exercises:
As written, the code assumes that users will enter only valid numeric values
into the quantity fields. We know better! Add validation that ensures that
only valid numeric entries are made. What should you do when an invalid
entry is made?
into the quantity fields. We know better! Add validation that ensures that
only valid numeric entries are made. What should you do when an invalid
entry is made?
When the options for unchecked appetizers are hidden, they are still
enabled and will be submitted along with the rest of the visible elements.
This is wasted bandwidth and more data for the server-side code to sift
through. How would you enable and disable the radio options at appropri-
ate times?
enabled and will be submitted along with the rest of the visible elements.
This is wasted bandwidth and more data for the server-side code to sift
through. How would you enable and disable the radio options at appropri-
ate times?
The form is incomplete. In fact, without a
<form>
element, it isn't a form
at all! Complete the
HTML
to make a valid form that can be submitted to
the server.