jQuery in Action
Dealing with form element values
79
Now that we've discussed handling general
DOM
elements, let's take a brief
look at handling a special type of element: form elements.
3.4 Dealing with form element values
Because form elements have special properties, jQuery's core contains a number
of convenience functions for activities like getting and setting their values, serial-
izing them, and selecting elements based on form properties. They will serve us
well in simple cases, but the Form Plugin--an officially sanctioned plugin devel-
oped by members of the jQuery Core Team--provides a much more robust set of
functionality. We'll discuss the Form Plugin in chapter 9.
of convenience functions for activities like getting and setting their values, serial-
izing them, and selecting elements based on form properties. They will serve us
well in simple cases, but the Form Plugin--an officially sanctioned plugin devel-
oped by members of the jQuery Core Team--provides a much more robust set of
functionality. We'll discuss the Form Plugin in chapter 9.
NOTE
When we use the term form element, we are referring to the elements that
can appear within a form and possess
can appear within a form and possess
name
and
value
attributes that sub-
mit to the server as request parameters when the form is submitted. Deal-
ing with such elements by hand in script can be tricky because, not only
can elements be disabled, but the
ing with such elements by hand in script can be tricky because, not only
can elements be disabled, but the
W3C
defines an unsuccessful state for
controls. This state determines which elements should be ignored during
a submission, and it's a tad on the complicated side.
a submission, and it's a tad on the complicated side.
That said, let's take a look at one of the most common operations we'll want to
perform on a form element: getting access to its value. jQuery's
perform on a form element: getting access to its value. jQuery's
val()
command
takes care of the most common cases, returning the
value
attribute of a form ele-
ment for the first element in the wrapped set. Its syntax is as follows:
This command, although quite useful, has a number of limitations of which we
need to be wary. If the first element in the wrapped set isn't a form element, a
JavaScript error is thrown. This command also doesn't distinguish between the
need to be wary. If the first element in the wrapped set isn't a form element, a
JavaScript error is thrown. This command also doesn't distinguish between the
Command syntax: val
val()
Returns the value property of the first element in the matched set. When the element is a
multi-select element, the returned value is an array of all selections.
multi-select element, the returned value is an array of all selections.
Parameters
none
Returns
The fetched value or values.
The fetched value or values.