You are here: Home » All Posts » HTML Forms » The HTML Form Submit Button

The HTML Form Submit Button

in HTML Forms

HTML form submit button

The basics of an HTML form submit button is discussed first in this article, moving towards more advanced topics like multiple submit buttons.

Note: If you are looking for a software tool for creating HTML forms quickly ( without even knowing HTML), see the article: How to make a web form and get it online quickly. This article contains more information about Simfatic Forms – an easy to use form creation software.

The code below creates a form submit button:

<input type="submit" name="mysubmit" value="Click!" />

name: specifies the identification assigned to this submit button.
value: is the label that appears on the button.

Identifying the submit button on the server side

The name and value of the button that is pressed to submit the form is passed to the server side script. For the button above, when you click on the submit button, the data passed to the server side script is: mysubmit="Click!"

Multiple Submit buttons

You can have more than one submit buttons in a form. But, how to identify from the server side which of the buttons was pressed to submit the form?

One way is to have different names for the submit buttons.

<input type="submit" name="Insert" value="Insert">
<input type="submit" name="Update" value="Update">

In the server side script you can do a check like this :

if(!empty($_REQUEST['Update']))
{
  //Do update here..
}
else
if(!empty($_REQUEST['Insert']))
{
  //Do insert Here
}

Note: The code depends on the server side scripting language you use. The code above is in PHP.

The second method is to have different values for submit buttons with the same name.

<input type="submit" name="Operation" value="Insert">
<input type="submit" name="Operation" value="Update">

The server side code goes like this (PHP code):

if($_REQUEST['Operation'] == 'Update')
{
  //Do update here..
}
else
if($_REQUEST['Operation'] == "Insert")
{
  //Do insert here
}

Switching the ‘action’ field dynamically

It is commonly required to switch the action field of the dynamically based on certain conditions.
Read: Switching HTML form ‘action’ field dynamically

How to submit a form using a hyperlink or an image?
Read: Tutorial on JavaScript Form Submit Methods

You can find more on HTML Forms in the HTML Form Tutorial

Using Simfatic forms, it is simple, quick & easy to create HTML forms. Click here for more info.

Be Sociable, Share!

{ 17 comments… read them below or add one }

Web Mantra January 31, 2014 at 10:39 am
Web Mantra January 31, 2014 at 10:38 am
Flash Games - العاب فلاش March 7, 2012 at 7:18 am

good tut i like it
:)
good luck

Reply

Null December 10, 2011 at 12:14 pm

Can you do this using javascript?

Reply

prakash November 27, 2011 at 6:32 pm

thanks for answers, but i have to change the confirm_box text as yes and no in place of ok and cancel..

Reply

Mihai Vinatoru October 25, 2011 at 11:16 am

I used your solution on my website. Thank you.

Reply

Ankit December 27, 2011 at 1:38 pm

Hi,

I want to create a form with HTML.. and put the 4 button on that form.. once we click on button. All appliciation should be open on by one..
If you have any idea please let me know.
Form>

</Form
I am able to open and one form ane one button with this coding but i do not know, how to create multiple botton o n one form..

Please be adviosed.

Reply

afzal October 2, 2011 at 3:59 am

Nice info….

Reply

Behzad September 15, 2011 at 11:56 am

Thank you.

Reply

Arizona Concrete Countertops June 28, 2011 at 6:05 pm

Thank you! we’ve been working on creating a ‘member’ page and needed a form for log-in purposes. this answered several questions about submitting the form.

Reply

Layton Miller May 24, 2011 at 11:32 pm

A note on the purpose of efficiency–
In the multi-form-submit example above, you don’t need to perform an ‘empty’ check.
You can just check the existence of the variable and you’re good, which takes us from 9+ lines of code down to a mere 4 (assuming you have one line to execute): :)
============================
if($_REQUEST['Update'])
echo “Update!”;
else if($_REQUEST['Insert'])
echo “Insert!”;

=======================
Hope that help somebody.

Reply

prasanth May 27, 2011 at 7:47 am

if($_REQUEST['Update'])
will fail when $_REQUEST['Update'] is set to 0. The check for existence of a variable is isset($_REQUEST['Update']) The check to make sure that a variable exists (can be 0) and is not empty is !empty($_REQUEST['Update']). There no inefficiency.

Reply

taslim May 12, 2011 at 6:19 am

this site very use full for my web development diploma course

Reply

thusitha April 30, 2011 at 3:43 pm

this site very use full for my web development diploma course

Reply

nirmala April 25, 2011 at 11:24 am

good

Reply

Jonn Mero March 15, 2011 at 1:07 pm

Hi!
Great, but where do you put in the recipient’s address?
Jonn

Reply

Ledenadministratie November 21, 2011 at 2:29 pm

John,
You can put that into the form:
Good luck

Reply

Leave a Comment

Previous post:

Next post: