Senden von JavaScript-Formularen – Dialogfeld zum Bestätigen oder Abbrechen der Übermittlung

Lesezeit: 4 Minuten

Senden von JavaScript Formularen – Dialogfeld zum Bestatigen oder Abbrechen der
matt

Für ein einfaches Formular mit einer Benachrichtigung, die fragt, ob Felder korrekt ausgefüllt wurden, brauche ich eine Funktion, die dies tut:

  • Zeigt ein Warnfeld mit zwei Optionen an, wenn auf die Schaltfläche geklickt wird:

    • Wenn auf „OK“ geklickt wird, wird das Formular gesendet
    • Wenn auf „Abbrechen“ geklickt wird, schließt sich das Warnfeld und das Formular kann angepasst und erneut übermittelt werden

Ich denke, eine JavaScript-Bestätigung würde funktionieren, aber ich kann nicht herausfinden, wie.

Der Code, den ich jetzt habe, ist:

function show_alert() {
  alert("xxxxxx");
}
<form>
  <input type="image" src="https://stackoverflow.com/questions/6515502/xxx" border="0" name="submit" onclick="show_alert();" alt="PayPal - The safer, easier way to pay online!" value="Submit">
</form>

1646056508 804 Senden von JavaScript Formularen – Dialogfeld zum Bestatigen oder Abbrechen der
Samuel Liew

Eine einfache Inline-JavaScript bestätigen würde genügen:

<form onsubmit="return confirm('Do you really want to submit the form?');">

Keine Notwendigkeit für ein externe Funktion es sei denn, Sie tun Validierungwas Sie etwa so tun können:

<script>
function validate(form) {

    // validation code here ...


    if(!valid) {
        alert('Please correct the errors in the form!');
        return false;
    }
    else {
        return confirm('Do you really want to submit the form?');
    }
}
</script>
<form onsubmit="return validate(this);">

  • Nur zur Verdeutlichung: Die Validierung auf der Clientseite (in JavaScript) sollte nur der Bequemlichkeit des Benutzers dienen. JavaScript-Code kann vom Benutzer frei bearbeitet werden und sollte nicht vertrauenswürdig sein. Die Real Die Validierung sollte immer im Backend erfolgen, um zu vermeiden, dass fehlerhafte oder böswillige Daten Ihre Datenbank oder Ihren Server erreichen.

    – Adrian Wiik

    7. September 2020 um 22:21 Uhr


  • Irgendwie, selbst wenn ich Abbrechen wähle, wird das Senden fortgesetzt (Chrome 86)

    – Muflix

    13. November 2020 um 8:00 Uhr

  • @Muflix Sie haben dann wahrscheinlich eine Rückgabeerklärung verpasst.

    – Samuel Liew

    13. November 2020 um 8:02 Uhr

  • @SamuelLiew Ich habe es noch einmal überprüft und festgestellt, dass es deswegen nicht funktioniert data-ajax=true -Attribut im asp.net-Core. Also implementiere ich stattdessen den Check on Submit-Button <button type="submit" onclick="return confirm('Are you sure?')">Submit</button>

    – Muflix

    13. November 2020 um 8:09 Uhr

1646056508 889 Senden von JavaScript Formularen – Dialogfeld zum Bestatigen oder Abbrechen der
Majid Fouladpour

Das im Kommentar angesprochene Problem ist gültig, also ist hier eine andere Überarbeitung, die dagegen immun ist:

function show_alert() {
  if(!confirm("Do you really want to do this?")) {
    return false;
  }
  this.form.submit();
}

Sie könnten die JS-Bestätigungsfunktion verwenden.

<form onSubmit="if(!confirm('Is the form filled out correctly?')){return false;}">
  <input type="submit" />
</form>

http://jsfiddle.net/jasongennaro/DBHEz/

  • onsubmit="return confirm('Is the form filled out correctly?');" wäre viel einfacher, und das Ergebnis wäre das gleiche.

    – Sk8erPeter

    10. September 2012 um 19:29 Uhr

Simpel und einfach :

<form onSubmit="return confirm('Do you want to submit?') ">
  <input type="submit" />
</form>

1646056509 579 Senden von JavaScript Formularen – Dialogfeld zum Bestatigen oder Abbrechen der
Alireza

OK, ändern Sie einfach Ihren Code in etwas wie folgt:

<script>
function submit() {
   return confirm('Do you really want to submit the form?');
}
</script>

<form onsubmit="return submit(this);">
   <input type="image" src="https://stackoverflow.com/questions/6515502/xxx" border="0" name="submit" onclick="show_alert();"
      alt="PayPal - The safer, easier way to pay online!" value="Submit">
</form>

Dies ist auch der ausgeführte Code. Ich mache es nur einfacher zu sehen, wie er funktioniert. Führen Sie einfach den folgenden Code aus, um das Ergebnis zu sehen:

function submitForm() {
  return confirm('Do you really want to submit the form?');
}
<form onsubmit="return submitForm(this);">
  <input type="text" border="0" name="submit" />
  <button value="submit">submit</button>
</form>

ConnectionAbortedError WinError 10053 Eine aufgebaute Verbindung wurde von der Software
Sumit Kumar Gupta

Wenn Sie beim Senden des Formulars eine Bedingung anwenden möchten, können Sie diese Methode verwenden

<form onsubmit="return checkEmpData();" method="post" action="process.html">
  <input type="text" border="0" name="submit" />
  <button value="submit">submit</button>
</form>

Eines solltest du immer im Hinterkopf behalten Methode und Aktion Attribut schreiben nach einreichen Attribute

Javascript-Code

function checkEmpData()
{
  var a = 0;

  if(a != 0)
  {
    return confirm("Do you want to generate attendance?");
  }
   else
   {
      alert('Please Select Employee First');
      return false;
   }  
}

888980cookie-checkSenden von JavaScript-Formularen – Dialogfeld zum Bestätigen oder Abbrechen der Übermittlung

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy