2011-08-11 19 views
0

私はこのフォームを正しく提出できません。ボタンのタイプが「送信」であれば、常に送信され、送信しないタイプとして「ボタン」を使用すると、正しい値が返されます。ifのステートメントは正しいパスに従っていますが、問題になる。jquery submit not working

<script type="text/javascript"> 
$(document).ready(function(){ 
$("#submitButton").click(function(e) { 
     var un = $('#username').val(); 
     $('#mike').html("");  
      $.ajax(
      {    
       type: "POST", 
       url: "Utilities/CheckUsername.php", 
       data: "un="+ un, 
       success: function(data2) 
       {     
        if(data2=="Username Does Not Exist") 
        {   
         $("#login2").submit();     
        } 
        else 
        { 
         $('#mike').html(data2); 
         return false;      
        }     
       } 

      }); 
      }); 

      }); 
      </script> 
</head> 
<body> 
     <form name="login" id="login2" method="post" action="dsds.html"> 
     UserName<input type="text" name="username" id="username"value=""> 
     <br/> 
     Password<input type="text" name="password" id="password" value=""> 
     <br/> 
     Password Again<input type="text" name="passwordagain" id="passwordagain" value=""> 
     <br/> 
     <input type="hidden" name="NewClass" id="NewClass" value="true"> 
     <br/> 
     <input type="submit" name="no" id="submitButton" value="submit"> 
    </form> 
    <span id = "mike"></span> 
</body> 
</html> 

EDIT: 私はここに戻り虚偽を追加し、それが動作しますが、なぜですか?クリックイベントからfalseを返すだけです

答えて

3

送信イベントハンドラからはreturn falseが必要です。 return falseあなたがそこにあるの後にの後に実行されません、アシックスajax呼び出しが終了しました。

また、同じことを行うe.preventDefault()を使用することもできます。

両方の方法では、デフォルト動作(フォームの送信)が発生しないようにするだけです。

+0

は私の問題を解決しました。苦情は、$ .post(..)ファイルが未定義であることでした。 –

2

私は、フォームのsubmitイベントにイベントハンドラをバインドお勧め:

$('#login2').submit(function(event) { 
    event.preventDefault(); 
    //... 
}); 

あなたがフォームを送信されたイベントのためのデフォルトのアクションを阻止しなければなりません。これはevent.preventDefault[docs]で行われます。 Ajaxコールバック内のreturn falseは、イベントハンドラが応答を受け取る前にを返してから、を返すので、何の効果もありません。

あなたがこれを行う場合は、あなたがしているプロセスのどの状態で表示するためのフラグのいくつかの種類を設定する必要があります。

var nameAvailable = false; 

$('#login2').submit(function(event) { 
    if(!nameAvailable) { 
     event.preventDefault(); // don't submit form 
     //... 
     $.ajax({ 
      success: function() { 
       // if name available 
       nameAvailable = true; 
       $('#login2').submit(); 
      } 
     }); 
    } 
});