Zwei Senden-Schaltflächen in einem Formular

534

Ich habe zwei Senden- Schaltflächen in einem Formular. Wie bestimme ich, welche Server-Seite getroffen wurde?

Alex
quelle
Erwägen Sie, die akzeptierte Antwort in die Antwort von Parrots zu ändern .
Peter Mortensen
2
@PeterMortensen - Weder die akzeptierte Antwort noch die Antwort von Parrot sind heute die besten. Siehe Leos Antwort für die neuere HTML5-Lösung mit Attribut formaction. Oder sehen Sie in der Antwort von kiril nach, wie der HTML-Code für den Benutzer unabhängig von dem an den Browser gesendeten Wert sichtbar gemacht werden kann. So wird das Internationalisierungsproblem auf einfachere Weise gelöst als die Antwort von Greg oder Parrot.
ToolmakerSteve

Antworten:

447

Wenn Sie jedem einen Namen geben, wird der angeklickte wie jede andere Eingabe gesendet.

<input type="submit" name="button_1" value="Click me">
Greg
quelle
101
Stellen Sie außerdem sicher, dass der Name der Schaltfläche den richtigen Namen hat! Zum Beispiel würde "button-1" NICHT funktionieren. Kann jemandem viel Ärger ersparen, denken Sie also daran.
pdolinaj
22
Normalerweise werden alle Eingaben im Formular mit dem Formular gesendet. Da der Wert einer Schaltfläche nur beim Klicken übermittelt wird, müssen Sie die Formularwerte nach diesen vordefinierten Namen durchsuchen. Ich denke, die andere Antwort ( stackoverflow.com/a/21778226/88409 ), bei der alle den gleichen Namen mit unterschiedlichen Werten erhalten, ist sinnvoller. Dann greifen Sie einfach auf den Wert unter einem einzelnen bekannten Formularfeldnamen zu. Es wird auch deutlicher, dass nur ein Wert (der angeklickte) für den angegebenen Eingabenamen gesendet wird, ähnlich wie Optionsfelder funktionieren (gleicher Name, unterschiedliche Werte).
Triynko
6
@Triynko, wie Robin Green in den Kommentaren dieser Antwort sagte, ist diese besser für die Internationalisierung. Wenn die Seite beispielsweise auf Spanisch gerendert wird, unterscheidet sich der Text der Schaltflächen wahrscheinlich. Wenn die Logik Ihres Codes vom Text dieser Schaltfläche abhängt, wird dies in diesem Fall nicht möglich sein. Das Verwenden des Namens ist sicherer, da es sich um einen Wert handelt, der dem Benutzer nicht angezeigt wird und daher eher als "private" Variable und weniger als Nachricht an den Benutzer behandelt werden kann.
Sfarbota
Um den Kommentar von @ sfarbota zu verdeutlichen: Die erste in Parrots Antwort gezeigte Lösung ist problematisch, da sie auf dem Testen des für den Benutzer sichtbaren Werts beruht . Das ist zweifelhaft - Code, der beim Ändern eines vom Benutzer sichtbaren Wortes unterbrochen wird, wird als "fragil" betrachtet. Die zweite Lösung, die in Parrots Antwort gezeigt wird, ist in Ordnung - sie ist dieselbe wie diese. Die zweite Lösung von Parrot zeigt auch den entsprechenden zu schreibenden Code, daher ist es eine nützlichere Antwort als diese.
ToolmakerSteve
2
Siehe Leos Antwort für die neuere HTML5-Lösung mit Attribut formaction. Oder lesen Sie die Antwort von kiril, wie der HTML- Code für den Benutzer unabhängig von dem an den Browser gesendeten Wert sichtbar gemacht werden kann, um das Internationalisierungsproblem zu lösen.
ToolmakerSteve
875

Lösung 1:
Geben Sie jeder Eingabe einen anderen Wert und behalten Sie den gleichen Namen bei:

<input type="submit" name="action" value="Update" />
<input type="submit" name="action" value="Delete" />

Überprüfen Sie dann im Code, welcher ausgelöst wurde:

if ($_POST['action'] == 'Update') {
    //action for update here
} else if ($_POST['action'] == 'Delete') {
    //action for delete
} else {
    //invalid action!
}

Das Problem dabei ist, dass Sie Ihre Logik mit dem für den Benutzer sichtbaren Text in der Eingabe verknüpfen.


Lösung 2:
Geben Sie jedem einen eindeutigen Namen und überprüfen Sie $ _POST auf das Vorhandensein dieser Eingabe:

<input type="submit" name="update_button" value="Update" />
<input type="submit" name="delete_button" value="Delete" />

Und im Code:

if (isset($_POST['update_button'])) {
    //update action
} else if (isset($_POST['delete_button'])) {
    //delete action
} else {
    //no button pressed
}
Papageien
quelle
37
Für i18n-Zwecke ist es möglicherweise besser, die ausgewählte Antwort zu verwenden.
Robin Green
11
@LaszloPapp Wie die Antwort selbst sagt, können Sie das Formular internationalisieren (dh in verschiedene Sprachen oder Dialekte übersetzen), ohne die Logik zu beeinflussen, wenn Sie die oben ausgewählte Antwort verwenden. Wenn Sie die erste Option in dieser Antwort verwenden, hängt die Logik von der Sprache ab, in der das Formular tatsächlich dargestellt wird.
Robin Green
1
@RobinGreen: Ich denke, die meisten Leute werden die zweite Logik verwenden, nicht wahr?
lpapp
5
i18n = i [nternationalizatio] n, und die 18 steht für die 18 Buchstaben zwischen dem ersten und dem letzten.
Buttle Butkus
18
Das OP hat nicht nach PHP gefragt.
Rudey
110

Eine noch bessere Lösung besteht darin, Schaltflächen-Tags zum Senden des Formulars zu verwenden:

<form>
    ...
    <button type="submit" name="action" value="update">Update</button>
    <button type="submit" name="action" value="delete">Delete</button>
</form>

Das HTML innerhalb der Schaltfläche (z. B. ..>Update<..das, was der Benutzer sieht; da HTML bereitgestellt wird, valueist das nicht für den Benutzer sichtbar; es wird nur an den Server gesendet. Auf diese Weise entstehen keine Unannehmlichkeiten bei der Internationalisierung und bei mehreren Anzeigesprachen (in der.) Bei der früheren Lösung ist die Beschriftung der Schaltfläche auch der an den Server gesendete Wert.

kiril
quelle
13
Anscheinend unterscheidet sich das Verhalten des Browsers. Einige senden das value-Attribut, andere die Zeichenfolge zwischen den Tags ... Seien Sie also vorsichtig mit diesem.
Jeroen Dierckx
1
Ich denke, das bereitgestellte Snippet wird vollständig unterstützt ( w3schools.com/tags/att_button_type.asp )
kiril
2
@kiril Das Snippet von diesem Link verwendet zwei verschiedene Arten von <button>: submitund reset. Beachten Sie, dass resetnichts gesendet wird, sondern nur das Formular zurückgesetzt wird. So bleibt Jeroens Argument.
Fizruk
7
Ok, du hast recht. Dann habe ich den HTML5 W3C Working Draft überprüft. Anführungszeichen: >> Das Attribut value gibt den Wert des Elements zum Zwecke der Formularübermittlung an. Der Wert des Elements ist der Wert des Wertattributs des Elements, falls vorhanden, oder ansonsten die leere Zeichenfolge. >> HINWEIS: Eine Schaltfläche (und ihr Wert) ist nur dann in der Formularübermittlung enthalten, wenn die Schaltfläche selbst zum Initiieren der Formularübermittlung verwendet wurde.
Kiril
8
@ Jeroen Bull. Welche Browser senden den Text zwischen den Tags? Eine Eingabe oder Schaltfläche sollte immer nur das Attribut 'value' senden. Eine Schaltfläche kann buchstäblich alles zwischen sich haben, einschließlich Bildern oder anderen HTML-Tags. Das ist der springende Punkt bei der Verwendung einer Schaltfläche über einem Eingabeelement, und Sie möchten vorschlagen, dass der Browser den gesamten Inhalt als Wert speichert? Auf keinen Fall.
Triynko
93

Hierfür gibt es einen neuen HTML5-Ansatz, das formactionAttribut:

<button type="submit" formaction="/action_one">First action</button>
<button type="submit" formaction="/action_two">Second action</button>

Anscheinend funktioniert dies in IE9 und früheren Versionen nicht, aber für andere Browser sollten Sie in Ordnung sein (siehe: HTML-Formatierungsattribut HTML <button> von w3schools.com ).

Persönlich verwende ich im Allgemeinen Javascript, um Formulare per Fernzugriff (für schneller wahrgenommenes Feedback) mit diesem Ansatz als Backup einzureichen. Zwischen den beiden sind IE <9 mit deaktiviertem Javascript die einzigen Personen, die nicht abgedeckt sind.

Dies kann natürlich unangemessen sein, wenn Sie grundsätzlich dieselbe Aktion serverseitig ausführen, unabhängig davon, welche Schaltfläche gedrückt wurde. Wenn jedoch zwei benutzerseitige Aktionen verfügbar sind, werden diese häufig auch zwei serverseitigen Aktionen zugeordnet.

Bearbeiten: Wie von Pascal_dher in den Kommentaren angegeben, ist dieses Attribut auch für das <input>Tag verfügbar .

Löwe
quelle
1
Auch für "Eingabe" -Tag verfügbar. Anpassung an w3schools: Bei Verwendung von Schaltflächen-Tags können verschiedene Browser unterschiedliche Werte senden
Pascal_dher
3
Ich bin seit 12 Jahren Webentwickler und dieser ist neu für mich und genau das, was ich brauchte. Vielen Dank!
KyleFarris
1
Gern geschehen @KyleFarris! Ich glaube, dass dies erst vor relativ kurzer Zeit möglich geworden ist, also keine Überraschung, wenn Sie noch nicht darauf gestoßen sind.
Leo
2
Hinweis für Rails-Benutzer: Das Hinzufügen dieses Attributs funktioniert nicht, wenn Ihr Formular mit erstellt wird form_tag. Der einzige Weg, wie ich es zum Laufen gebracht habe, ist zu wechseln form_forund zu benutzen f.submit formaction: 'your_path'.
fgblomqvist
2
formactionauf MDN
Akinuri
27

Dies ist sehr einfach zu testen

<form action="" method="get">

<input type="submit" name="sb" value="One">
<input type="submit" name="sb" value="Two">
<input type="submit" name="sb" value="Three">

</form>

Fügen Sie das einfach in eine HTML-Seite ein, klicken Sie auf die Schaltflächen und sehen Sie sich die URL an

Peter Bailey
quelle
5
Die Verwendung von GET ist hier eine etwas schlechte Praxis. Wenn möglich, sollte POST verwendet werden.
Syncrossus
6
@Syncrossus Das dient zu Testzwecken.
Etienne Martin
22

Verwenden Sie das formactionHTML-Attribut (5. Zeile):

<form action="/action_page.php" method="get">
    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br>
    <button type="submit">Submit</button><br>
    <button type="submit" formaction="/action_page2.php">Submit to another page</button>
</form>
Thirumalmani Lavanyan
quelle
2
Dies ähnelt Leos früherer Antwort .
ToolmakerSteve
@ToolmakerSteve - Aber Benutzer haben upvoted . Treffen Sie Ihre Wahl!!
user12379095
21
<form>
    <input type="submit" value="Submit to a" formaction="/submit/a">
    <input type="submit" value="submit to b" formaction="/submit/b">    
</form>
MevlütÖzdemir
quelle
HTML5-Funktion. Funktioniert perfekt mit aktuellen Webbrowsern, danke!
Stephane Lallemagne
1
HINWEIS: Dies scheint mit Leos früherer Antwort identisch zu sein , außer dass die Verwendung eines inputTags anstelle eines Tags buttonangezeigt wird.
ToolmakerSteve
11

Der beste Weg, um mit mehreren Submit-Buttons umzugehen, ist die Verwendung von Switch Case im Serverskript

<form action="demo_form.php" method="get">

Choose your favorite subject:

<button name="subject" type="submit" value="html">HTML</button>
<button name="subject" type="submit" value="css">CSS</button>
<button name="subject" type="submit" value="javascript">Java Script</button>
<button name="subject" type="submit" value="jquery">jQuery</button>

</form>

Servercode / Serverskript - wo Sie das Formular senden:

demo_form.php

<?php

switch($_REQUEST['subject']) {

    case 'html': //action for html here
                break;

    case 'css': //action for css here
                break;

    case 'javascript': //action for javascript here
                        break;

    case 'jquery': //action for jquery here
                    break;
}

?>

Quelle: W3Schools.com

Shailesh Sonare
quelle
Ja, Sie müssen eine Vorstellung von Aktionsskripten haben (serverseitige Skripttechnologie). Sie können jedes Skript / jede Datei verwenden, um übermittelte Daten zu verarbeiten, z. B. PHP, ASP, JSP usw. <form action="demo_form.php" method="get">
Shailesh Sonare
Okay. Dies war verwirrend, da es auch eine Sprache namens ActionScript gibt. Sie sollten stattdessen sagen: "Servercode" oder "Serverskript".
Zivilist
Ich hatte keine Ahnung, dass Sie das mit Knöpfen tun könnten
William Isted
10

Vielleicht haben die hier vorgeschlagenen Lösungen im Jahr 2009 funktioniert, aber ich habe all diese optimierten Antworten getestet und niemand arbeitet in einem Browser.

Die einzige Lösung, die ich gefunden habe, ist folgende: (aber es ist ein bisschen hässlich zu benutzen, denke ich)

<form method="post" name="form">
<input type="submit" value="dosomething" onclick="javascript: form.action='actionurl1';"/>
<input type="submit" value="dosomethingelse" onclick="javascript: form.action='actionurl2';"/>

Joakim
quelle
2
Warum nicht einfach benutzen formaction="actionurl1"? Sie benötigen kein JavaScript.
Rybo111
3
@ Rybo111 IE9 Browser (Hexe ist noch relativ weit verbreitet) unterstützt nichtformaction
ahnungslos007
1
@inaliaghle Richtig, es sind ungefähr 1% der Benutzer - es hängt davon ab, an wen sich das Projekt richtet. Ungefähr 1% der Benutzer verwenden kein JavaScript.
Rybo111
1
Für zukünftige Leser: Es ist nichts Falsches daran, Javascript zu verwenden, wie in dieser Antwort. Es ist eine nützliche Fähigkeit zu wissen. OTOH, die höher bewerteten Antworten funktionieren auch gut - ignorieren Sie den Hauptsatz dieser Antwort. Wenn Sie diese anderen Antworten aus irgendeinem Grund nicht zum Laufen bringen können, veröffentlichen Sie Ihren vollständigen Code als SO-Frage, erklären Sie, was passiert (oder nicht passiert), und fragen Sie, was Sie falsch machen.
ToolmakerSteve
6

Definieren nameals array.

<form action='' method=POST>
    (...) some input fields (...)
    <input type=submit name=submit[save] value=Save>
    <input type=submit name=submit[delete] value=Delete>
</form>

Beispiel für einen Servercode (PHP):

if (isset($_POST["submit"])) {
    $sub = $_POST["submit"];

    if (isset($sub["save"])) {
        // save something;
    } elseif (isset($sub["delete"])) {
        // delete something
    }
}

elseifsehr wichtig, da beide analysiert werden, wenn nicht. Genießen.

Thielicious
quelle
Dies ist ein ausgezeichneter Vorschlag - hauptsächlich, weil Sie sehr einfach mehr Schaltflächen mit mehr Fällen hinzufügen und eine switchmit einer Standardaktion verwenden können, wenn Sie eine Schaltfläche hinzugefügt und vergessen haben, sie dem switch(und / oder falsch geschriebenen Element usw.) hinzuzufügen.
Gwyneth Llewelyn
Außerdem hat @Pato eine ähnliche Antwort hinzugefügt , die möglicherweise idiomatischer ist, aber Ihre funktioniert gut!
Gwyneth Llewelyn
1
@GwynethLlewelyn Ich habe die andere Antwort nicht zurück gesehen oder nicht bemerkt, als ich meine eigene schrieb. Es ist eigentlich dasselbe, aber dies unterstreicht einfach, wie die meisten Menschen diese Logik bevorzugen. Der Unterschied besteht nur aus Namen aus semantischen Gründen, einem guten Verständnis für Anfänger oder wer auch immer damit anfangen möchte.
Thielicious
5

Da Sie nicht angegeben haben, welche serverseitige Skriptmethode Sie verwenden, gebe ich Ihnen ein Beispiel, das für Python mit CherryPy funktioniert (obwohl es auch für andere Kontexte nützlich sein kann):

<button type="submit" name="register">Create a new account</button>
<button type="submit" name="login">Log into your account</button>

Anstatt anhand des Werts zu bestimmen, welche Schaltfläche gedrückt wurde, können Sie den Namen verwenden ( <button>anstelle des Tags <input>). Auf diese Weise entstehen keine Probleme, wenn Ihre Schaltflächen denselben Text enthalten. Die Namen aller Formularelemente, einschließlich Schaltflächen, werden als Teil der URL gesendet. In CherryPy ist jedes dieser Argumente ein Argument für eine Methode, die den serverseitigen Code ausführt. Wenn Ihre Methode nur **kwargseine Parameterliste enthält (anstatt mühsam jeden einzelnen Namen jedes Formularelements einzugeben), können Sie überprüfen, welche Schaltfläche wie folgt gedrückt wurde:

if "register" in kwargs:
    pass #Do the register code
elif "login" in kwargs:
    pass #Do the login code
Brōtsyorfuzthrāx
quelle
3
<form method="post">
<input type="hidden" name="id" value="'.$id.'" readonly="readonly"/>'; //any value to post PHP
<input type='submit' name='update' value='update' formAction='updateCars.php'/>
<input type='submit' name='delete' value='delete' formAction='sqlDelete.php'/>
</form>
Osmar Kozan Jr.
quelle
2

Ich denke, Sie sollten in der Lage sein, den Namen / Wert in Ihrem GET-Array zu lesen. Ich denke, dass die Schaltfläche, auf die nicht geklickt wurde, nicht in dieser Liste angezeigt wird.

John Bubriski
quelle
Sie meinen höchstwahrscheinlich das POST-Array.
Ypnos
3
Nicht unbedingt, wenn die Methode des Formulars "POST" ist, wird sie nicht im GET-Array angezeigt. Die meisten Formulare werden per POST eingereicht.
Papageien
2
Entweder / oder ist technisch richtig und doch so falsch. Sie können ein Formular mit method = "GET" einreichen, aber es ist wertvoll.
Bill the Lizard
4
Es ist nur bei unangemessener Verwendung "würdig": w3.org/2001/tag/doc/whenToUseGet.html .
Mercator
2
Ja, ich habe nicht versucht, GET vorzuschlagen, ich habe nur versucht, Dinge zu verallgemeinern.
John Bubriski
1

Sie können es auch so machen (ich denke, es ist sehr praktisch, wenn Sie N Eingänge haben).

<input type="submit" name="row[456]" value="something">
<input type="submit" name="row[123]" value="something">
<input type="submit" name="row[789]" value="something">

Ein häufiger Anwendungsfall wäre die Verwendung unterschiedlicher IDs aus einer Datenbank für jede Schaltfläche, sodass Sie später auf dem Server wissen könnten, auf welche Zeile geklickt wurde.

Auf der Serverseite (in diesem Beispiel PHP) können Sie "row" als Array lesen, um die ID zu erhalten. $_POST['row']wird ein Array mit nur einem Element in der Form sein [ id => value ](zum Beispiel :) [ '123' => 'something' ].

Um die angeklickte ID zu erhalten, gehen Sie wie folgt vor:

$index = key($_POST['row']);

http://php.net/manual/en/function.key.php

Pato
quelle
Dies ähnelt der Antwort, die @Thielicious veröffentlicht hat , aber Ihre ist möglicherweise idiomatischer. Persönlich bevorzuge ich alphanumerische Tags für den Index (im Gegensatz zu Zahlen), um die Lesbarkeit zu verbessern (leichter zu merken, was jede Schaltfläche tun soll), aber YMMV. Aber es $_POST['row']ist klug, die Vorteile eines assoziativen Arrays zu nutzen!
Gwyneth Llewelyn
1
Ich bin damit einverstanden, dass Sie, wenn Sie mit statischen Schaltflächen arbeiten, benannte Schlüssel verwenden sollten. Aber in einigen Fällen können Sie nicht. Manchmal generieren Sie diese Eingaben dynamisch. Der häufigste Fall hierfür ist eine Liste von Zeilen, die jeweils durch eine ID gekennzeichnet sind. Ich glaube, ich habe über diesen Fall nachgedacht, als ich die Antwort schrieb (vor 4 Jahren!). Ich habe es so bearbeitet, dass es offensichtlicher ist, dass die Nummer eine ID und kein Index ist.
Pato
Gut gemacht! Ja, ich stimme zu, es ist jetzt offensichtlicher; Ich glaube immer noch, dass Ihre Antwort geringfügig besser ist als die von @Thielicious (und möglicherweise sogar ein bisschen effizienter, insbesondere wenn es viele Schaltflächen gibt).
Gwyneth Llewelyn
1

Sie bilden eine Schaltfläche für mehrere Senden in einem Formularbeispiel

 <input type="submit" name="" class="btn action_bg btn-sm loadGif" value="Add Address" title="" formaction="/addAddress"> 
 <input type="submit" name="" class="btn action_bg btn-sm loadGif" value="update Address" title="" formaction="/updateAddress"> 
Thirumal Mani L.
quelle
0

Einfach können Sie die Aktion des Formulars auf verschiedenen Senden-Schaltflächen ändern. Klicken Sie auf.

Versuchen Sie dies in document.Ready

$(".acceptOffer").click(function () {
       $("form").attr("action", "/Managers/SubdomainTransactions");
});

$(".declineOffer").click(function () {
       $("form").attr("action", "/Sales/SubdomainTransactions");
});
Slan
quelle
0

Sie können auch ein href-Attribut verwenden und ein Get mit dem für jede Schaltfläche angehängten Wert senden. Aber das Formular wäre dann nicht erforderlich

href="/SubmitForm?action=delete"
href="/SubmitForm?action=save"
Jonathan Laliberte
quelle
Dies würde für Controller unter POSTRouten nicht funktionieren .
Xavi Montero
daher "send a get"
Jonathan Laliberte
3
Es tut mir leid, nicht zuzustimmen, aber es GETist nicht immer geeignet. Wenn Sie "den Status Ihres Modells ändern", sollten Sie niemals a verwenden GET, da eine Aktualisierung des Browsers dazu führen kann, dass zweimal dieselbe Anfrage transparent gesendet wird. Verwenden Sie diese Option GETnur zum "Anzeigen" von Dingen und POSTzum Senden von Anforderungen für Statusänderungen (Hinzufügen, Entfernen, Bearbeiten usw.). POSTÄndern Sie dann in Ihrer Controller-Aktion den Status (Datenbank, Sitzung ...) und geben Sie eine Umleitungsantwort aus, die dann GETden neuen geänderten Status enthält. Das Ändern GETdes Modellzustands ist sehr schmutzig, und jeder gute Codierer sollte dies vermeiden. Tut mir leid, das sagen zu müssen. Clean Code Rulez.
Xavi Montero
Wahr. Aber schmutzig zu spielen kann manchmal sauber sein. Es hängt davon ab, was Sie genau tun. Persönlich würde es keine Lösch- und Bearbeitungsanforderungen auf einem Get zuordnen, aber es gibt Möglichkeiten, es zum Laufen zu bringen. Zum Beispiel zu überprüfen, ob es bereits gelöscht wurde oder ob der Benutzer die Berechtigung dazu hat usw.
Jonathan Laliberte
-1

Sie können die Schaltflächen folgendermaßen präsentieren:

<input type="submit" name="typeBtn" value="BUY">
<input type="submit" name="typeBtn" value="SELL">

Und dann können Sie im Code den Wert erhalten mit:

if request.method == 'POST':
    #valUnits = request.POST.get('unitsInput','')
    #valPrice = request.POST.get('priceInput','')
    valType = request.POST.get('typeBtn','')

(valUnits und valPrice sind einige andere Werte, die ich aus dem Formular extrahiere, das ich zur Veranschaulichung hinterlassen habe.)

user3714578
quelle
-1

Da Sie nicht angegeben haben, welche serverseitige Skriptmethode Sie verwenden, gebe ich Ihnen ein Beispiel, das für PHP funktioniert

<?php
   if(isset($_POST["loginForm"]))
   {
    print_r ($_POST); // FOR Showing POST DATA
   }
   elseif(isset($_POST["registrationForm"]))
   {
    print_r ($_POST);
   }
   elseif(isset($_POST["saveForm"]))
   {
    print_r ($_POST);
   }
   else{

   }
?>
<html>
<head>
</head>
<body>
  
  <fieldset>
    <legend>FORM-1 with 2 buttons</legend>
      <form method="post" >
      <input type="text" name="loginname" value ="ABC" >

     <!--Always use type="password" for password --> 
     <input type="text" name="loginpassword" value ="abc123" >
     
     <input type="submit" name="loginForm" value="Login"><!--SUBMIT Button 1 -->
     <input type="submit" name="saveForm" value="Save">  <!--SUBMIT Button 2 -->
   </form>
  </fieldset>



  <fieldset>
    <legend>FORM-2 with 1 button</legend>
     <form method="post" >
      <input type="text" name="registrationname" value ="XYZ" >
      
     <!--Always use type="password" for password -->
     <input type="text" name="registrationpassword" value ="xyz123" >
     
     <input type="submit" name="registrationForm" value="Register"> <!--SUBMIT Button 3 -->
   </form>
  </fieldset>
  

</body>
</html>

Formen

Wenn Sie auf Login -> loginForm klicken

Wenn Sie auf Speichern -> saveForm klicken

Wenn Sie auf Registrieren -> Registrierungsformular klicken

Pradip Kumar Raushan
quelle