Formular mit einer Schaltfläche außerhalb des <form>-Tags abschicken

Question

Sagen wir, ich habe:

<form method="get" action="something.php">
    <input type="text" name="name" />
</form>

<input type="submit" />

Wie gehe ich über das Absenden dieses Formulars mit dieser Schaltfläche außerhalb des Formulars, ich denke, in HTML5 theres ein Action-Attribut für die einreichen, aber ich bin nicht sicher, wenn das ist voll Cross-Browser und wenn es nicht ist es irgendwie, dies zu tun?

Answer 1

In HTML5 gibt es das Formular-Attribut . Grundsätzlich

<form id="myform" method="get" action="something.php">
    <input type="text" name="name" />
</form>

<input type="submit" form="myform" value="Update"/>

Answer 2

Eine Lösung, die bei mir gut funktioniert, fehlt hier noch. Sie erfordert eine visuell versteckte <submit> o <input type="submit"> Element innerhalb der <form> und eine zugehörige <label> Element außerhalb davon. Das würde dann so aussehen:

<form method="get" action="something.php">
     <input type="text" name="name" />
     <input type="submit" id="submit-form" class="hidden" />
</form>

<label for="submit-form" tabindex="0">Submit</label>

Mit diesem Link können Sie nun das Formular "anklicken <submit> Element durch Anklicken des <label> Element.

Answer 3

<form method="get" id="form1" action="something.php">

</form>

<!-- External button-->
<button type="submit" form="form1">Click me!</button>

Das hat bei mir funktioniert, um eine Remote-Übermittlungsschaltfläche für ein Formular zu haben.

Answer 4

Wenn Sie jQuery verwenden können, können Sie dies verwenden

<form method="get" action="something.php" id="myForm">
    <input type="text" name="name" />

    <input type="submit" style="display:none" />
</form>

<input type="button" value="Submit" id="myButton" />

<script type="text/javascript">
    $(document).ready(function() {
       $("#myButton").click(function() {
           $("#myForm").submit();
       });
    });
</script>

Also, die Quintessenz ist es, eine Schaltfläche wie Submit zu erstellen, und legen Sie die echte Schaltfläche Senden in das Formular (natürlich versteckt es), und senden Sie Form von Jquery durch Klicken auf die 'Fake Submit' Taste. Hoffentlich hilft das.

Answer 5

Ähnlich wie eine andere Lösung hier, mit kleinen Änderungen:

<form method="METHOD" id="FORMID">
   <!-- ...your inputs -->
</form>
<button type="submit" form="FORMID" value="Submit">Submit</button>

https://www.w3schools.com/tags/att_form.asp