2011-06-21 13 views
0

名前、電子メール、ファイルのアップロードを含むHTMLマルチパートフォームがあります。JavaScript:フォーム送信の前にAjaxを呼び出すための制御ロジック?

私はまずユーザーをAjaxに登録したいと考えています。登録が成功すると、フォームを送信してください。失敗した場合は、フォームを提出しないようにします。

は、これは私のコードです:

--- HTML --- 
    <form id="account-form" method="post" enctype="multipart/form-data" data-ajax="false" action="upload.php" > 
    <input type="text" name="username" id="username" /> 
    <input type="email" name="email" id="email" /> 
    <input type="file" id="mediaupload" name="mediaupload" accept="image/*" /> 
    </form> 
    --- JavaScript --- 
    accountform.submit(function(event) { 
    var registration_ok = true; 
    // See if we can register the user 
    // And if we can, submit the form. 
    $.ajax({ 
     type: "POST", 
     url: "/usercreate.php", 
     data: postdata, 
     dataType: 'json', 
     success: function(data) { 
      // fine to submit the form. 
     }, 
     error: function (data){ 
      // If this fails, we don't want to submit the form! 
      registration_ok = false; 
     } 
    }); 
    return registration_ok; 
    }); 

しかし、それは常にtrueを返します - 私は、主な機能はAjaxのエラーが呼び出される前を返すので、これがあると思います。

登録が失敗した場合、どのようにしてフォームが返されないようにするにはどうすればよいですか?

ありがとうございます!

答えて

2

あなたが代わりにregistation_okの、常にfalseを返し、その後、成功機能で、移動する必要があります:

document.forms["account-form"].submit(); //edited 

つまり、あなたが押したときにフォームを送信することはありません送信ボタン、AJAXが戻るのを待ってから、登録が成功した場合にのみフォームを送信してください。偽、パラメータ申し訳

+0

ああ、私は参照してください - ありがとう。ニースの解決策:) – Richard

0

あなたの.ajaxステートメントのonSuccessハンドラでフォームをプログラムで送信するだけではどうですか?

このような何か:

document.forms["account-form"].submit(); 
+0

私は無限ループを取得しているので、... – Richard

+0

正しく実行していないのですか? – SBerg413

+0

私はそれを最初に持っていて、それは 'accountform.submit'関数を何度も繰り返し呼び出していました。しかし、私は@ Ordの答えから、デフォルトとして 'return false'を返すべきだったはずです。 – Richard

0

は、あなただけの非同期を追加し、syncronic AJAX呼び出しを行うことができます。成功メソッドの内部では、form.submit();をトリガーします。

+0

大丈夫、それは、問題を解決します、ありがとう! – Richard

0

私は質問を誤解:

0

問題はAJAX呼び出しが非同期であるため、successerror関数は関数は(あなたがtrueにあらかじめ設定)registration_ok値を返した後まで呼び出されないということです。

+0

はい、確かに、それは問題です:) – Richard

関連する問題