Multiple Submit Button in One Form

Question: How do I put multiple submit button in one form, including some Javascript validation, in PHP or ASP?

Answer: Some of us find that we have to put more than one submit button in our HTML form. Let say, we have a product page, with the details in the input boxes that we could update them. In the same page, we also have a ‘DeleteThis Product’ button. And maybe, one more button, which will add some other things. This is how we do it:

First, we have to set the HTML form. Let’s make it like this. You can name it as index.php:

<title>Multiple Submit Button in One Form</title>
<form name=”myform” action=”index.php” method=”post”>
<input type=”hidden” name=”action” value=””>
<input type=”hidden” name=”product_id” value=”01″>
Product Name: <input type=”text” name=”product_name” value=”Product 1″><br />
Price: <input type=”text” name=”price” value=”USD1.00″><br />
Description: <textarea name=”desc” cols=”48″ rows=”8″>This is the description of the product</textarea>
Other Things: <input type=”text” name=”other” value=”This is the other things”>
<input type=”button” name=”submit_other” value=”Submit Other Things” onClick=”submitForm(document.myform, ‘other_things’);”><br /><br />
<input type=”button” name=”submit” value=”Save Changes” onClick=”submitForm(document.myform, ‘save_changes’);”>
<input type=”button” name=”delete” value=”Delete Product” onClick=”submitForm(document.myform, ‘delete_product’);”>

Ok, now let’s find how to make sure each submit button will submit to its own action. This uses javascript, and should be placed in the <head> section.

function submitForm(form, action) {
form.action.value = action;
if (form.action.value == ‘save_changes’) {
if (form.product_name.value == ”) alert(‘Please enter the Product Name!’);
else if (form.price.value == ”) alert(‘Please enter the Product Price!’);
else form.submit();
else if (form.action.value == ‘delete_product’) {
x = confirm (“Are you sure to remove this product?”);
if (x!=1)
return 0;
else {
else if (form.action.value == ‘other_things’) {
if (form.other_things.value == ”) alert(‘Please enter the other things!’);
else form.submit();

Remember, put it in the <head> section.

Next, the processing section. This example submits the form to its own page, called index.php. So we have to put the action code in this page, and should be placed on top.

For ASP users, see the example after this PHP code. Remember, change the index.php to index.asp.

// assume that the database connection already set

switch ($_POST[‘action’]){
case “save_changes”:
$q=”UPDATE product SET product_name=’$_POST[‘product_name’]’, price=’$_POST[‘price’]’, desc=’$_POST[‘desc’]’ WHERE id=$_POST[‘product_id’]”;

case “delete_product”:
$q=”DELETE FROM product WHERE id=$_POST[‘product_id’]”;

case “other_things”:
$q=”UPDATE product SET other_things=’$_POST[‘other’]’ WHERE id=$_POST[‘product_id’]”;
if ($_POST[‘action’] != ”) {
if ($this->db->Affected_Rows()) {
echo “<script>alert(\”Success.\”);</script>”;
} else {
echo “<script>alert(\”Failed.\”);</script>”;

ASP users, copy this one:

‘ you may use your own database connection
set conn=Server.CreateObject(“ADODB.Connection”)
conn.Open “c:/webdata/database.mdb”

select case Request.Form(“action”){
case “save_changes”:
sql=”UPDATE product SET product_name='”&Request.Form(“product_name”)&”‘, price='”&Request.Fomr(“price”)&”‘, desc='”&Request.Form(“desc”)&”‘ WHERE id=”&Request.Form(“product_id”)
conn.Execute sql
case “delete_product”:
sql=”DELETE FROM product WHERE id=”&Request.Form(“product_id”)
conn.Execute sql
case “other_things”:
sql=”UPDATE product SET other_things='”&Request.Form(“other”)&”‘ WHERE id=”&Request.Form(“product_id”)
conn.Execute sql

end select

This entry was posted in ASP, HTML, JavaScript, PHP. Bookmark the permalink.

2 Responses to Multiple Submit Button in One Form

  1. thank berguna bgt,
    tp aku pakai yg model ngecek nilai valuenya di PHP, jadi



    Met kenal dr Jogjakarta!
    Sambang2 ke Blogku yaaa

  2. Pingback: MFA Made for Adsense Auto Content

Tinggalkan Jawapan

Please log in using one of these methods to post your comment: Logo

Anda sedang menulis komen melalui akaun anda. Log Out /  Tukar )

Google+ photo

Anda sedang menulis komen melalui akaun Google+ anda. Log Out /  Tukar )

Twitter picture

Anda sedang menulis komen melalui akaun Twitter anda. Log Out /  Tukar )

Facebook photo

Anda sedang menulis komen melalui akaun Facebook anda. Log Out /  Tukar )


Connecting to %s