マウスをクリックしてボタンを入力してください。

Question

私はMOUSE CLICKとENTERでフォームを送信しています。 Ajaxのコールがチェックされ

は、ユーザーがフォームを送信することができない場合、私はすでにデータベースに...それ以外のボタンをSUBMIT任意の指定が無効になりますです

jQueryの

function check_designation(e){ 

    text = $('#req1').val(); 
    data = "data=" + text;   
    text_length = text.length   

    if(text_length == 0) 
    { 
     $('#result_span').html(''); 
    }  

    if(text_length > 3){ 
     $.ajax({ 
      url: "designation_ajax.php", 
      type: "POST", 
      data: data,  
      cache: false, 
      success: function (response) { 
       if ($.trim(response) == "access") { 
        $("#result_span").html('<div class="green">' + text + ' is available '+'</div>'); 
        $('#create_desg').removeAttr('disabled'); 
       } 
       else if ($.trim(response) == "no access") {               
        $("#result_span").html('<div class="red">' + text + ' is already in use'+'</div>'); 
        $('#create_desg').attr('disabled','disabled');              
       } 

       else { 

        alert('Sorry, unexpected error. Please try again later.'); 

       } 
      }  
     }); 
    } 
    else{ 
     $("#result_span").html('');  

    } 

    return true;   
} 

HTMLのFORM

<form id="formID" class="formular" method="POST" action="" onsubmit="formSubmit()" > 
    <fieldset> 
    <legend>Create Desination</legend> 
    <label> Designation<br clear="all" /> 
     <input autocomplete="off" onkeyup="check_designation(event)" value="" class="validate[required,minSize[4]] text-input float_left" type="text" name="name" id="req1" /> 
     <span id="result_span"></span> 
    </label> 
    <br clear="all" /> 
    <input id="create_desg" value="Submit" type="button" /> 
    </fieldset> 
</form> 

問題:::

これでDISABLEボタンは解決策ではありません。既にテーブル内にDESIGNATIONがある場合は...送信ボタンは無効になりますが、ENTERキーで送信されます。ページをリロードする必要はありません。私がEnterを押したときにAJAXが機能しない

Answer 1

デフォルトアクションを取り消すには、onsubmitハンドラからfalseを返す必要があります。しかし、私はおそらくあなたのコードビットをきれいにし、控えめに提出するイベントをサブスクライブします：

<form id="formID" class="formular" method="POST" action=""> 
    <fieldset> 
     <legend>Create Desination</legend> 
     <label> 
      Designation<br clear="all" /> 
      <input autocomplete="off" value="" class="validate[required,minSize[4]] text-input float_left" type="text" name="name" id="req1" /> 
      <span id="result_span"></span> 
     </label> 
     <br clear="all" /> 
     <input id="create_desg" value="Submit" type="button" /> 
    </fieldset> 
</form> 

あなたは、私が入力フィールドからonkeyupイベントを意図的に削除していることがわかります。このフィールドの中でユーザーがキーを押すたびにAJAXリクエストを使用してサーバーを攻撃しても、サーバーには何の効果もありません。これを実装したいのであれば、AJAXリクエストを送信する前にいくつかの入力が蓄積され、スロットルされるのを待つことをお勧めします。その後、

と：

$(function() { 
    $('#formID').submit(function() { 
     var text = $('#req1').val(); 
     if(text.length == 0) { 
      $('#result_span').html(''); 
     }  

     if(text.length > 3) { 
      $.ajax({ 
       url: 'designation_ajax.php', 
       type: 'POST', 
       data: { data: text }, 
       cache: false, 
       success: function (response) { 
        if ($.trim(response) == 'access') { 
         $('#result_span').html('<div class="green">' + text + ' is available '+'</div>'); 
         $('#create_desg').removeAttr('disabled'); 
        } 
        else if ($.trim(response) == 'no access') { 
         $("#result_span").html('<div class="red">' + text + ' is already in use'+'</div>'); 
         $('#create_desg').attr('disabled', 'disabled'); 
        } else { 
         alert('Sorry, unexpected error. Please try again later.'); 
        } 
       }  
      }); 
     } else { 
      $('#result_span').html('');  
     } 

     // return false to prevent the default action 
     return false; 
    }); 
}); 

また、私は代わりにあなたが解析し、あなたのsuccessコールバックでトリミングされているいくつかのaccessとno access文字列のdesignation_ajax.phpスクリプトリターンJSONを持っているでしょう。