The Button Element

The button element represents an html input of type 'submit', 'reset', or 'button' and is used to create buttons that perform special functions within the form:

 

Create a button by clicking 'Button' under the Form Elements heading in the 'Add New Element' menu:

Then edit the attributes for the button

and click the 'Create' button.

ID

ID is the document object model identifier for the button. The important thing to remember about any id you assign is to make it unique among all the elements in the form. The editor will remind you if you try to assign a duplicate id to any element.

Name

Name is the identifier used by your form processing script to determine if this button has been pressed by the user. A name=value pair will be sent with this name and the value specified by the Button Text attribute.

Button Text

This is the text you want to appear on the button and also represents the value of the button in the name=value pair sent to your form processing script.

Type

Type represents the intended purpose of this button (what action occurs within the form when the button is pressed).

The default is 'Submit' which sends the form data to your form processing script.

'Reset' sets all elements in the form to their intial values.

'Button' is a generic button element that has no default behavior and is typically used to activate client-side scripts.

Access Key

Access Key allows you to specify a character that will allow a user to select the button without using the mouse or another pointing device. The actual key combinations (shift-[key], alt-[key], etc.) vary by browser.

Although designed to make forms more accessible to those unable to use a mouse, this attribute can cause conflicts with other assistive technology (like screen readers) and is poorly implemented at best. I've included it here for completeness, but be sure to research the implications of specifying an Access Key before doing so.

Tab Order

By using the 'tab' key on their keyboard, a user can cycle through and access all the elements in your form without using the mouse to select them. Tab Order allows you to specify the position of the button in your form's tabbing order.

If this attribute is left blank (or set to 0), this button will be placed in the tabbing order as it appears in the form.

If Tab Order is set to a negative number, this button will be removed from the tabbing order.

If set to a positive number, elements in the form will be selected in increasing Tab Order with this button being selected in the position you enter here.

Disabled

When Disabled is set to 'yes', a user will be unable to enter text into the button. Additionally, a disabled button cannot receive focus, will be skipped in tabbed navigation, and it's contents will not be sent to your form processing script.

Read Only

When Read Only is set to 'yes', a user will be unable to modify the text in the button. However, unlike a disabled button, a button set to read only can receive focus, will appear in tabbed navigation, and it's contents will be sent to your form processing script.

Editing / Deleting a Button

The "Edit Button" form is the same as the "Add New Button" form with two exceptions.

First, the current values for each attribute are filled in. Edit these attributes as you wish then click the 'Save' button at the bottom of the form to save your changes.

Additionally, a link to delete the button can be found below the 'Save' button:

Click this link to permanently delete the button.