2012-04-13 2 views
1

Ich bin Formular über Mausklick und ENTER auch einreichen.SENDEN FORM mit Mausklick und geben Sie die Taste

Ajax-Aufruf ist die Überprüfung ist es eine Bezeichnung, die ich bereits in der Datenbank .. Wenn nicht, Benutzerformular sonst Taste

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> 
SPERREN Zustellen einreichen

PROBLEM ::::

Nun, was passiert DISABLE-Taste ist keine lösung ... wenn es bereits eine DESIGNATION in einer Tabelle gibt .. submit button wird deaktiviert aber mit ENTER wird es gesendet und ich möchte die Seite nicht neu laden. und AJAX funktioniert nicht, wenn ich drücke ENTER

Antwort

4

Sie müssen false von Ihrem Handler onsubmit zurückgeben, um die Standardaktion abzubrechen. Aber ich würde wahrscheinlich Ihren Code ein wenig reinigen und abonnieren Sie den einreichen Ereignis unaufdringlich:

<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> 

Sie werden feststellen, dass ich absichtlich das onkeyup Ereignis aus dem Eingabefeld entfernt haben. Hämmern Sie Ihren Server mit AJAX-Anfragen jedes Mal, wenn ein Benutzer einen Schlüssel anklickt, während er sich in diesem Feld befindet, wird das Ihrem Server nichts bringen. Wenn Sie dies implementieren möchten, würde ich Ihnen empfehlen, auf einige Eingaben zu warten, bevor Sie die AJAX-Anfrage senden.

und dann:

$(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; 
    }); 
}); 

Auch hätte ich die designation_ajax.php Skript Rückkehr JSON statt einigen access und no access Strings, die Sie parsen und in Ihrem success Rückruf trimmen.

+0

Nein, zuerst rufen Sie Ihre Funktion und dann geben Sie false zurück, wie folgt: 'onsubmit =" formSubmit(); return false; "'. Oder abonnieren Sie unauffällig den Submit-Handler, wie in meiner Antwort gezeigt. –

+0

Danke für Ihre ausführliche Antwort .. –

Verwandte Themen