it-swarm.com.de

Jquery-Funktion VOR Formulareinreichung

Ich versuche, eine Funktion mit Jquery auszulösen, wenn auf die Schaltfläche zum Senden des Formulars geklickt wird. Die Funktion muss jedoch ausgelöst werden, BEVOR das Formular tatsächlich gesendet wird.

Ich versuche, einige div-Tag-Attribute bei der Übermittlung in ausgeblendete Textfelder zu kopieren und dann das Formular zu senden.

Es ist mir gelungen, dies mithilfe der Mouseover-Funktion zum Laufen zu bringen (wenn die Schaltfläche "Senden" mit der Maus über den Zeiger gezogen wird). Dies funktioniert jedoch nicht auf mobilen Geräten, die Touch verwenden.

$("#create-card-process.design #submit").on("mouseover", function () {
    var textStyleCSS = $("#cover-text").attr('style');
    var textbackgroundCSS = $("#cover-text-wrapper").attr('style');
    $("#cover_text_css").val(textStyleCSS);
    $("#cover_text_background_css").val(textbackgroundCSS);
});

Ich habe mit der .submit-Funktion herumgespielt, aber die Werte werden nicht in den Feldern gespeichert, da die Funktion ausgelöst wird, wenn das Formular gesendet wird und nicht zuvor.

Danke vielmals

54
Matt Price

Sie können die Onsubmit-Funktion verwenden.

Wenn Sie false zurückgeben, wird das Formular nicht gesendet. Lesen Sie darüber hier .

$('#myform').submit(function() {
  // your code here
});
85
kartikluke
$('#myform').submit(function() {
  // your code here
})

Das oben genannte ist NICHT, das in Firefox arbeitet. Das Formular wird einfach übermittelt, ohne dass Sie Ihren Code zuerst ausführen müssen. Die ähnlichen Probleme werden auch an anderer Stelle erwähnt ... wie diese Frage . .__ Die Arbeit wird umgangen

$('#myform').submit(function(event) {

 event.preventDefault(); //this will prevent the default submit

  // your code here (But not asynchronous code such as Ajax because it does not wait for response and move to next line.)

 $(this).unbind('submit').submit(); // continue the submit unbind preventDefault
})
44
Waqas Bukhary

Aghhh ... mir fehlte etwas Code, als ich die .submit-Funktion ausprobierte.

Das funktioniert:

$('#create-card-process.design').submit(function() {
var textStyleCSS = $("#cover-text").attr('style');
var textbackgroundCSS = $("#cover-text-wrapper").attr('style');
$("#cover_text_css").val(textStyleCSS);
$("#cover_text_background_css").val(textbackgroundCSS);
});

Danke für all die Kommentare. 

2
Matt Price

Sie können div oder span anstelle von button verwenden und dann eine Funktion aufrufen, die das Formular am Ende abschickt.

<form id="my_form">
   <span onclick="submit()">submit</span>
</form>

<script>
   function submit()
   {   
       //do something
       $("#my_form").submit();
   }
</script>
2
Skriptotajs

Basierend auf der Antwort von Wakas Bukhary könnten Sie es asynchron machen, indem Sie die letzte Zeile in den Antwortbereich setzen.

$('#myform').submit(function(event) {

  event.preventDefault(); //this will prevent the default submit
  var _this = $(this); //store form so it can be accessed later

  $.ajax('GET', 'url').then(function(resp) {

    // your code here 

   _this.unbind('submit').submit(); // continue the submit unbind preventDefault
  })  
}
0
SoMa

Nur weil ich diesen Fehler jedes Mal gemacht habe, wenn ich die Submit-Funktion verwende.

Dies ist der vollständige Code, den Sie benötigen: 

Fügen Sie dem HTML-Formular-Tag die ID " yourid " hinzu. 

<form id="yourid" action='XXX' name='form' method='POST' accept-charset='UTF-8' enctype='multipart/form-data'>

der jQuery-Code: 

$('#yourid').submit(function() {
  // do something
});
0
meck373