CHApTer 6 ■ WorkIng WITH ForMS
The form in the preceding code snippet is configured to use the post method and to submit its data to myserver/
somescript.php. Besides the method and action attributes that set these values, there is a name attribute that we have
set to "myForm". In AngularJS, it is quite likely that the name attribute will be far more important to you than the other
form element attributes. Why is this? In short, it is because developers tend to use Ajax to send data to the server, and
they often do not rely on the form element’s attributes to determine how the Ajax operation is carried out. (I discuss
this further in the next chapter.) Setting a name on the form will give you access to some very worthwhile AngularJS
features, which we will examine shortly.
■ Tip Ajax is a group of technologies used in combination. However, JavaScript developers often use the term to refer
to the use of JavaScript for exchanging data asynchronously between a browser and server to avoid full-page reloads.
Of course, a form is no good without form-related elements nested within it, so let’s look at these next. We’ll start
with the very versatile input element.
The input Element
The input element is the form workhorse. You can use it to create text fields, check boxes, radio buttons, and more. It
all hinges on what you specify as the value of its type attribute. Its possible values include the following:
button
checkbox
file
hidden
image
password
radio
reset
submit
text
Following, we will look at the most frequently used of these attributes.button
This is a simple clickable button that doesn’t actually do anything if left to its own devices. It is usually used along with
JavaScript to implement some sort of custom behavior. Here’s how you create one:
submit
This is a button too. However, unlike button, this has built-in functionality associated with it. This submit button
triggers the browser to gather up and submit all of the form’s data and send it along to its destination. The destination
is the value of the action attribute that was declared on the form element. An important point here is that only the data
within the form that the submit button resides in is sent along to the destination. This makes perfect sense when you
consider that you can have more than one form on your page. Here’s what it looks like: