Field Properties

When the text is selected, we find some settings that we can enter for this text field, at the bottom of the properties window.
Let me quickly go over this once.
Far left we have the ID of the text, in this case “name”.
We also find the box “char width”. When we type a value, this text box becomes wider or narrower.
Among them we find the “Max Chars” field.
When you enter a value here, the user of the form can never exceed the number of characters than what you enter here for this text filed.
In addition, there are three “Types”: “Single line”, “Multi line” and “Password”.

The type “Single line” is a text field with a rule that is fairly obvious.
Choose your type as “Multi line”, this will change the text field into a “Text Area”.
Choose your type “password”, then asterisk (*) characters will appear when someone types in this text field.
And then we have the box “Init val”. The text you type in this box will be displayed in the “form”. Obviously, this can be removed by the user.

When there is text in a text field, the properties window looks a little different. You can enter the number of lines that provides the height of the text field, this has nothing to do with the number of characters that the user can enter, only the size of the box.
And then we have the box “Wrap”.
In the “wrap” you have four options: you have “Default”, “Off”, “Virtual”, and “Physical.”

This will determie how the text is displayed when someone types text into the box.
“Off” will put all the typed text on a line, you would certainly not want to select it.
“Virtual” will return the text automatically when the user is typing it.
“Physical”will only display the text when the user of the form presses the Enter key on his keyboard.
And then we have the “Default” which does the same as the “Virtual”, which I think is the best choice.

Maybe another tip, if you wish to change some text into text field, or vice versa, you only need to change the “type” in the properties window. You do not have to add anything again.

Checkbox, Radio Button and radio button group

The first thing I’m going to discuss is the check box. First, place the cursor in your document where you want it.
Click the “Check Box” button in the “Forms” tab.

This will open the “Input Tag Accessibility Attributes” dialog.
If it gets on your nerves and want to turn this off so that it no longer appears.
Click on “Edit” in the menu bar and select “Preferences”. Choose the category “Accessibility”, and click the box for the text “Form objects”, so this is unchecked.
The next time you add an object to your form, it will not be shown.
If you wish you reopen it later, then repeat the same steps, just check the box again.

OK, we go further.
So if we click the “Checkbox”, Dreamweaver will have added the box in your document. The difference between a checkbox and a radio button is that you have the possibility to select one or more options with check boxes, but you can only select one option with a radio button.
When this is selected, we have some options in the properties.
The first option is a name you can enter for the box, the second option is “Checked value” for the box, and the third option lets you decide if you want to display the box checked or unchecked in the form.
We use a check box when the user is usually going to make at least one choice.

We use the option “Radio button group”, when the user has only one choice to make from a number of options.
Again, we first place the cursor in the document where we want to insert.
Click the “Radio button group” button in the “Forms” tab.
This opens a dialog where we enter a group name in the top box.
And in the window below, we give the various options.
Click the + button to add items, click the item in the window to change the text of the “Label” or “Value”.
To delete an item, select it in the list and click the – button.
To rearrange items in the list , select the item and click the button with the upward or downward pointing arrow.

And at the bottom of the dialog, we have two options.
With the first option, the various items on the page are separated by a line break.
The second option will display them in a table that Dreamweaver will create for this.
I choose the second option and click the OK button

If you like to add an option later, place the cursor in the bottom cell of the table and click the tab key on your keyboard.
This gives you an extra row.
With the cursor in that row, click the “Button” button in the “Forms” tab.
This puts the radio button at the bottom of the table.
All you have to do is just insert the radio button and type “name” and “Checked value” in the Properties window.

Especially the name of the button is important. This MUST be the same as the radio buttons above.

Featured Courses

• Downloading iPad Apps
• Lesson 1: Introduction to Publisher
• Lesson 65: File Formats