Welcome to Bucaro TecHelp!

Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Use an Image as a Form Submit Button

Most modern websites use an image submit button rather than the default gray button. It's very easy to create an image submit button because the html input type="image" by default creates a from submit button. The only thing you need is to provide an image for the button.

Shown below is example code of a form that uses an image submit button. Here the visitor would request a report to be sent to their email.

<form name="reportform" action="http://www.domain.com/formcode.asp">
<label>Email Address: </label><input type="text" name="email" size="28" />
<input type="image" align="middle" name="submit" alt="Send Report" border="1" width="46" height="31" src="sendreport.jpg">
</form>

Note: A link to the server-side code that processes the form data needs to be placed in the form tag's action attribute as shown in the code. The form shown above does not actually submit the form to the server, but instead uses the image button's onclick event along the javascript shown below to display the form's data. This is a good way to test a form.

onclick="alert(document.reportform.email.value); return false;"

More HTML Code:
• The Heading Tags
• Using col and colgroup to Apply Attributes to a Table Column
• Divide a Table Into Head (thead), Body (tbody), and Footer (tfoot) Sections
• Nesting HTML Lists
• Setting the Number of Items Visible in a Select List
• Radio Button Basics
• Code For a Basic 2-Column Fluid Webpage Layout
• How to Troubleshoot an HTML Table
• HTML List Basics
• Use Meta Tags for Search Engine Optimization

RSS Feed RSS Feed


Follow Stephen Bucaro Follow @Stephen Bucaro



Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2019 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268