Jquery displaying confirmation dialog on form submit

Brauche ich zu display Bestätigungs-Dialogfeld auf das Bild klicken. Code in "onclick" - Abschnitt des Bildes sollte nur dann durchgeführt werden, wenn jquery Bestätigungs-dialog true zurückgegeben.

Zu diesem Zeitpunkt, wenn der Benutzer klickt auf $(".submit_image") - dialog angezeigt wird, aber die form ist noch vorgelegt.

Die Logik sollte die gleiche sein, sowohl für jquery.alerts plugin oder eine reguläre javascript-confirm-dialog.

<form name="myform">
<img class="submit_image" onclick="myform.field1.value='1';myform.field1.value='2'; myform.submit();">
</form>


$(document).ready(function(){
   //catch submit 
   $(".submit_image").click(function(e){
       jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
      return r;
       });
   });
});

InformationsquelleAutor Kelvin | 2009-09-11

  1. 3
    return jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
  return r;
});

    Vielleicht? jQuery braucht Sie, um zurückzukehren "false" aus .klicken Sie auf Funktion zu stoppen, die Standard-Aktion, und jetzt bist du nicht Rückkehr nichts von dieser Funktion.

    * EDIT *

    Ich sah an jConfirm, und weil, wie es funktioniert (speziell, weil es nichts zurückgibt; es kann nur den Wert über die Rückruffunktion) ist es unmöglich, es zu benutzen, wie Sie wollen. Was müssen Sie tun, sondern ist einfach IMMER false zurück von deiner onclick-handler, und klicken Sie dann in Ihrem jConfirm Rückruf manuell aufrufen eines Formulars.

    Beispiel:

    $(document).ready(function(){
  //catch submit 
  $(".submit_image").click(function(e){
    jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
      //If they confirmed, manually trigger a form submission
      if (r) $(".submit_image").parents("FORM").submit();
    });
    //Always return false here since we don't know what jConfirm is going to do
    return false;
  });
});
    Dank machineghost, aber das funktioniert nicht.
    Gut, meine Erklärung bleibt richtig, ich habe gerade keine Ahnung, wie diese verrückte jConfirm Ding funktioniert. Was ist die Funktion(r) gibt? Sie müssen, um das herauszufinden. Alternativ könnte man einfach ein normales Fenster.bestätigen dialog (return true/false auf, was der Benutzer ausgewählt hat), aber wenn Sie nicht wollen, zu tun, müssen Sie zu Lesen, auf die Dokumentation Ihrer jConfirm-Funktion, um herauszufinden, wie man ein true/false zurück von ihm (und dann return, true/false).
    Kelvin, bitte siehe meine überarbeitete Antwort oben und lassen Sie mich wissen, wenn es für Sie gearbeitet.
    Danke für Antworten machineghost. Ich habe versucht, diese Idee, aber noch keinen Erfolg. Ich denke das "return false" nicht verhindern, dass Formular wird eingereicht, da seine ausgeführt im click-Ereignis.
    Das kann nicht das Problem sein. Versuchen Sie Folgendes, wenn Sie mir nicht glauben; du wirst sehen, die "falsch" zurückgegeben, die von der Bild onClick verhindert, dass das Formular "onSubmit" auftreten: <html><head><script> </script><body> <form onSubmit="alert('test')"> <input type="image" src="sstatic.net/so/img/logo.png" onclick="return false"/> </form> </body> </html>

    InformationsquelleAutor machineghost

  2. 1

    Müssen Sie brechen Ihre Veranstaltungen. Eine für das Bild onclick aufrufen, Formular "onsubmit", und dann Formulars onsubmit, das ist der geeignete Ort für die "false" zurückgeben, um den halt des Formulars.

    Jeff, sollte nicht die Verhinderung des Bildes onClick verhindern, dass das Formular "onsubmit" aus immer auftretenden (über die stopPropagation Anruf, dass jQuery machen, wenn Sie false zurück)?
    Nicht, wenn Sie mit der Tabulatortaste in das Bild und drücken Sie die EINGABETASTE...

    InformationsquelleAutor Jeff Ober

  3. 0

    Fand ich die Lösung zu meinem problem, aber einige änderungen im bestehenden code muss noch durchgeführt werden.

    In html platzierte ich Bild innerhalb des anchor-tag mit href = das, was ich hatte in Bild onclick-Ereignis.

    <form name="myform">
<a href="javascript: myform.field1.value='1';myform.field2.value='2'; myform.submit();" class="submit_image_link"><img src="..."></a>
</form>

    E Hinzugefügt.preventDefault () - Methode auf, um zu verhindern, dass Standard-Ereignis für Anker, die folgenden link oder javascript im href-Abschnitt. So wie ich das verstehe, "return=false" oder "preventDefault ()" hat nicht funktioniert für mich in meinem ursprünglichen code, da "img" - tag, nicht jede Standard-Aktion.

    $(document).ready(function(){
   //catch submit 
   $(".submit_image_link").click(function(e){
    e.preventDefault();
    jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
        if (r) location.href = $(".submit_image_link").attr('href');
    });
   });
});
    Ok, drei Fragen .... 1) Statt mit einer a gewickelt um ein IMG und mit JS zu tun, die reichen, es gibt einen viel einfacheren Weg: verwenden Sie einfach ein <input type="image"/>; es hat sogar den submit-Logik direkt in ... 2) Rückgabe von false durch ein jQuery-verbunden-Ereignishandler ist IDENTISCH zum Aufruf e.preventDefault(); e.stopPropagation(); handler ... siehe docs.jquery.com/Events/bind ... 3) wenn jemand zu verschwenden Ihre Zeit zu helfen, Ihre Frage zu beantworten, ist es eher unhöflich, zu erstellen Sie Ihre eigene Antwort und verweigern Ihnen jeglichen Kredit für alle Zeit, die Sie verbrachte.
    4) wenn Sie sich für die Verwendung EINES a/IMG (anstelle eines INPUT[type='image']) Sie brauchen nicht myform.reichen in Ihrem A href, noch müssen Sie das e zu.preventDefault; das ist, was verursacht alle die Probleme. Alles, was Sie brauchen, ist ein submit-Aufruf in Ihr JConfirm Rückruf. Es ist der Unterschied zwischen sagen "einzureichen, sobald dieser geklickt wird; warten, auf die Sie geklickt haben? nicht vorlegen; Sie bestätigt? ok jetzt senden", und sagte: "Sie bestätigt? submit". Mit Ihrer e.preventDefault Sie werden IMMER verhindern, ist die Standard-Aktion auf der A passiert; wenn du gehst zu tun, Sie könnte genauso gut nicht es hook up in den ersten Platz.
    Hallo machineghost, sorry, wenn ich dich in irgendeiner Weise verletzt, die ich definitiv nicht gemeint. Ich wiederhole noch einmal, dass ich dankbar für Ihre Hilfe. Ich kann nicht, Stimmen Sie für Ihren Beitrag noch nicht, da mein Profil ansehen ist nicht hoch genug. Nun, in Bezug auf Ihre anderen Korrekturen: 1) ich nicht verwenden <input type="image"/> da ich nicht will das ändern vorhandener code eine Menge (auch, diese Taste befindet sich außerhalb der form). 2) ja, das ist richtig, ich Stimme mit Ihnen überein. 4) ich habe immer original-code, so dass der andere Teil der alten Anwendung nicht betroffen. Aber ich Stimme mit Ihnen überein, dass dies der bessere Weg. Danke nochmal für deine Hilfe.
    "Ich kann mir keine Stimme für deinen post noch" ich bitte um Entschuldigung, ich habe vergessen, dass einige Leute sich nicht zu genehmigen, Antworten (und ich habe Leute die "nehmen Sie meine Antwort und genehmigen Sie Ihre eigene Antwort" was vor, also sprang ich die Waffe). Froh ich sein konnte, der assitance.

    InformationsquelleAutor Kelvin

Schreibe einen Kommentar