jqueryフォームバリデーターは決してajaxコールを作成しません

Question

これは部分的にこのスレッドの続きです：jquery - return value from callback function (in post request) into the function its inside of? 私はコードを更新したが、それでも問題は解決しないためです。私はjQueryを使ったシンプルなHTMLフォームを検証しています。他のすべてのif/elseステートメントが動作しているにもかかわらず、ajax呼び出しは決して行われません。ここにjavascriptコードがあります：

var pass_form = $（ '＃pass_form'）; pass_form.submit（valid_pass_sett）;

$username = $_SESSION['username']; 
$pass_old = $_POST['pass_old']; 
$pass_new = $_POST['pass_new']; 
if (empty($pass_old) || empty($pass_new)) { 
    echo "invalid"; 
} else if (!User::valid_user_pass($username, $pass_old)) { 
    echo "invalid_old"; 
} else if (!Sanitize::is_legal_password($pass_new)) { 
    echo "invalid_new"; 
} else { 
    echo "valid"; 
} 

私はFirebugのでデバッグしていて、他のすべてのフォームの入力が正しいか、スクリプトは、その後、AJAX呼び出しを取得します：

function valid_pass_sett() { 
    //remove old errors - snipped 
    pass_old = $('input[name=pass_old]').val(); 
    pass_new = $('input[name=pass_new]').val(); 
    pass_confirm_new = $('input[name=pass_confirm_new]').val(); 

    if (pass_old === "") { 
     //display error on form - snipped 
     return false; 
    } else if (pass_new === "") { 
     //display error on form - snipped 
     return false; 
    } else if (pass_new != pass_confirm_new) { 
     //display error on form - snipped 
     return false; 
    } else if (pass_new.length < 8) { 
     //display error on form - snipped 
     return false; 
    } else { 
     $.post("http://www.example.com/ajax/validate.php",{ // async validation 
      type: 'valid_old_change_pass', 
      pass_old: pass_old, 
      pass_new: pass_new 
     }, valid_pass_combo_callback); 
     alert('after the ajax call...'); 
    } 
    return false; // cancel form submission 
} 

、ここではValidate.phpとの関連部分ですコールバック関数を呼び出すはずですが、フォームを送信します。これは、コールバック関数のコードです：

function valid_pass_combo_callback(data) { 
    if (data == 'valid') { 
     //only if the form is valid! 
     pass_form[0].submit(); 
    } 
    else if (data == "invalid_old") { 
     //display error on form - snipped 
    } 
    else if (data == "invalid_new") { 
     //display error on form - snipped 
    } 
    else { 
     //it always jumps to here..., even though data *is* the correct value 
    } 

} 

EDITの再来：[OK]を最初の回答に見られるように、私は、私のコールバック関数でエラーを修正し、そして今、さまざまな問題のビットが浮上しています。私は関数valid_pass_combo_callbackをデバッグし、validate.phpから正しい値を得ています。この場合は、invalid_oldが返されます。私がデバッグするとき、dataはinvalid_oldに等しいです。しかし、比較は失敗します...コード常には、何があっても最後のelseステートメントにジャンプします。そこに何の行動もないので、何も起こらないので、比較はいつも失敗しているのですか？

EDIT、SOLVED：この関数をサブミットするのをやめ、フォームのボタン（サブミットボタンの代わりに使用しています）のonclickイベントにバインドして、問題を解決しました。ボタンがクリックされたときに検証が呼び出され、クライアント側の検証に合格すると、フォームは検証のためにサーバーに送信されます。

あなたのコードを見てみると

$.post("http://www.example.com/ajax/validate.php",{ // async validation 
     type: 'valid_old_change_pass', 
     pass_old: pass_old, 
     pass_new: pass_new 
    }, valid_pass_combo_callback); // Remove (data) so the callback 
            // isn't invoked immediately. 

Answer 1

一つの問題は、あなたが、あなたのコールバックを呼び出す関数自体を渡していないです提出される。私は、フォームのサブミットが行われているので、コードの下にいくつかのjsエラーがあると思います。

$.post("http://www.example.com/ajax/validate.php",{ // async validation 
      type: 'valid_old_change_pass', 
      pass_old: pass_old, 
      pass_new: pass_new 
     }, valid_pass_combo_callback(data));//Here is the issue, it will call the method right away 
     alert('after the ajax call...'); 

なぜフォーム送信のデフォルト動作を防止しないのですか？

function valid_pass_sett(e) { 

    e.preventDefaul();//This will ensure the form will never be submitted. 

コールバックメソッドでは、送信ハンドラをバインド解除してフォームを送信するための小さな変更を行います。これは、すでに1つのサブミットハンドラがあり、次回のメソッドでサブミットするときに次回コールする必要がないからです。

function valid_pass_combo_callback(data) { 
    if (data === 'valid') { 
     //only if the form is valid! 
     pass_form[0].unbind('submit').submit(); 
    } 
    else if (data === "invalid_old") { 
     //display error on form - snipped 
    } 
    else if (data === "invalid_new") { 
     //display error on form - snipped 
    } 
} 

Answer 2

フォームを送信するが、AJAX呼び出しを行うために持っていけないが、あなたは、フォームがあると言う：ここ