2010-11-24 14 views
1

電子メールフィールドの検証を行っています。このために私はこのようなhtmlコードを書かれている:フォームの検証が正しく機能していない

<form action="#"> 
      <span class="email-field" id="email-field"> 
      <input type="text" name="email-id" onFocus="if(this.value=='Your email ID'){this.value=''}" onBlur="if(this.value==''){this.value='Your email ID'}" id="email-id" /> 
      <input type="text" name="email-id" onFocus="if(this.value=='Please enter email ID'){this.value=''}" onBlur="if(this.value==''){this.value='Please enter email ID'}" id="error-email-id" class="hide"/> 
      </span> 
      <input type="submit" id="submit-button" class="subscribe-button" value=""> 

</form> 

jqueryのは、私がで書かを持っている。このためです:

$(document).ready(function() { 
    var filter = /^([a-zA-Z0-9_.-])[email protected](([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/; 
    URL = 'http://localhost:8000/' 


    $("#submit-button").click(function() { 
    email = $("#email-id").val() 

if($.trim($("#email-id").val()) === 'Your email ID' || !(filter.test($("#email").val()))) { 
    $('#error-email-id').fadeIn('slow').removeClass("hide"); 
    $('#email-id').fadeOut('normal').addClass("hide"); 
    $('#email-field').addClass("error-highlight"); 
    return false; 
} 
else { 

    $.ajax({ 
    type: 'POST', 
    url: URL + "validate/" , 
    data: {"email-id": email}, 
    success: function(data) { 
    }, 
    dataType: "json", 
    }); 
    $('#form').fadeOut('normal').addClass("hide"); 
    $('#notification').fadeIn('slow').removeClass("show") 
    return false; 
} 


    }); 

scnarioはこのようなものです: - 1.私はemailを入力してください初めてcorrectの場合はsuccessful callをそのurlにします。 2. wr ong emailを入力した場合、またはvalidation failsの場合は、適切なクラス(id:'error-email-id'のテキスト入力フィールド)が表示されます。しかし、私がsubmit buttonをクリックしたとき、いいえJS callが起こる。つまり、Jqueryを呼び出さないので、URLはありません。それはstaticのままです。
ありがとうございました!!!

+0

コードの書式を確認したい場合は、中括弧が欠けているようです – manraj82

答えて

0

return false;を使用すると、フォームが通常の方法で送信されないようにすることができます。手動で検証が成功した場合は(あなたがform要素にID regFormを追加することを仮定して)フォームを送信する必要があります。

$.ajax({ 
    type: 'POST', 
    url: URL + "validate/" , 
    data: {"email-id": email}, 
    success: function(data) { 
    $('#regForm').submit(); 
    }, // ... 

あなたはおそらくのサーバ側部分からサーバの応答dataを(確認したいですフォームの検証)をフォームに入力する前に、成功関数内で実行します。