jQuery modales Dialogfeld ist nicht mein Formular Absenden

Die Lösung ist einfach... der Schaltfläche Namen. Warum Fragen Sie? Ich werde Ihnen zeigen!

Nehmen diese jsfiddle und bemerkt, dass ich nur ein paar änderungen vorgenommen. Das javascript hat sich nicht geändert, nur die HTML -

HTML

<form id="myform" action="javascript:alert('Success!')" method="post">
    <input type="text" name="check_me" />
    <input type="submit" name="btnSubmit" value="Go!" />
</form>
<div id="confirm" style="display:none;">Please confirm that you want to submit</div>​

Habe ich zwei änderungen vorgenommen:

1. Ich habe die Aktion um ein javascript-Aufruf für jsfiddle Kompatibilität
2. Ich geändert-Taste name, um etwas anderes als senden

Ich hatte zu tun, #2, weil das aufrufen $('#myform').einzureichen war, verweisen auf die-Taste, nicht die submit-Methode, und jQuery habe alle Arten von verwirrt. Durch das umbenennen einer Taste, die $('#myform').senden bleibt die zu erwartende jQuery-submit-Funktion und jeder ist glücklich.

Stolperte ich über diese durch das gehen über mehrere Iterationen, die ich gehalten habe unten für die Nachwelt.

Glück!

======= ORIGINAL-BEITRAG UNTEN========

Wenn alles, was Sie tun möchten, ist "dieses Problem lösen", können Sie umgestalten, wie folgt:

HTML

<form id="myform" action="#" method="post">
    <input type="text" name="check_me" />
    <input type="button" id="btnSubmit" value="Go!" />
</form>
<div id="confirm" style="display:none;">Please confirm that you want to submit</div>​

JavaScript

$(document).ready(function(){
    var submitForm = $('#myform');
    submit = false;

    $("#confirm").dialog({
        resizable: false,
        height: 140,
        modal: true,
        autoOpen: false,
        buttons: {
            'Submit': function() {
                $(this).dialog('close');
                submit = true;
                submitForm.submit();
            },
            'Cancel': function() {
                $(this).dialog('close');
            }
        }
    });
    $("#confirm").parent().appendTo($("#myform")); 

    $("#btnSubmit").click(function() {
        $("#confirm").dialog('open');
    });

    submitForm.submit(function() {
        if (submit) {
            return true;
        }
    });
});​

Seltsam, die unter die so gut funktioniert:

HTML

<form id="myform" action="javascript:alert('success!');" method="post">
    <input type="text" name="check_me" />
    <input type="button" id="btnSubmit" value="Go!" />
</form>
<div id="confirm" style="display:none;">Please confirm that you want to submit</div>​

JavaScript

$(document).ready(function(){
    var submitForm = $('#myform');
    submit = false;

    $("#confirm").dialog({
        resizable: false,
        height: 140,
        modal: true,
        autoOpen: false,
        buttons: {
            'Submit': function() {
                $(this).dialog('close');
                submit = true;
                $('#myform').submit();
                //submitForm.submit();
            },
            'Cancel': function() {
                $(this).dialog('close');
            }
        }
    });
    $("#confirm").parent().appendTo($("#myform")); 
    $("#btnSubmit").click(function() { $('#myform').submit(); });

    submitForm.submit(function() {
        if (submit) {
            return true;
        } else {
            $("#confirm").dialog('open');
            return false;
        }
    });
});​

Das einzige was ich hier geändert wurde, entfernt die Schaltfläche "senden" und 100% Absenden per jQuery.

Können Sie versuchen, auf submit-Ereignis form haben verschiedene Art von Veranstaltungen.

onsubmit="return confirm('Please confirm that you want to submit')"

sehen diese "BEARBEITEN , jetzt können Sie ändern, erstellen Sie eine Funktion mit Modalen Dialogfeld true oder false zurück.