2012-11-24 70 views
1

我試圖添加一個異常,如果用戶沒有輸入任何內容或輸入錯誤的「聯繫人ID」,然後按回車,則會出現錯誤消息&通知用戶未找到ID。任何幫助?在此先感謝:)這裏是我的index.html文件。表單驗證在php/ajax

<html> 
    <body> 
     <script language="javascript" type="text/javascript"> 

    function ajaxFunction(e){ 
    var e=e || window.event; 
    var keycode=e.which || e.keyCode; 
    if(keycode==13 || (e.target||e.srcElement).value==''){ 
    var http; // The variable that makes Ajax possible! 

    try{ 
     // Opera 8.0+, Firefox, Safari 
     http = new XMLHttpRequest(); 
    } catch (e){ 
     // Internet Explorer Browsers 
     try{ 
      http = new ActiveXObject("Msxml2.XMLHTTP"); 
     } catch (e) { 
      try{ 
       http = new ActiveXObject("Microsoft.XMLHTTP"); 
      } catch (e){ 
       // Something went wrong 
       alert("Your browser broke!"); 
       return false; 
      } 
     } 
    } 

    var url = "getagentids.php?param="; 
       var idValue = document.getElementById("agid").value; 
       var myRandom = parseInt(Math.random()*99999999); // cache buster 
       http.open("GET", "getagentids.php?param=" + escape(idValue) + "&rand=" + myRandom, true); 
       http.onreadystatechange = handleHttpResponse; 
       http.send(null); 
     function handleHttpResponse() { 
        if (http.readyState == 4) { 
         results = http.responseText.split(","); 
         document.getElementById('agfn').value = results[0]; 
         document.getElementById('agsal').value = results[1]; 
         document.getElementById('agtel').value = results[2]; 
         document.getElementById('agid').value = results[3]; 
        } 
       } 
    } 
} 

</script> 

     <form> 
      <table> 
       <tr> 
        <td>Contact ID:</td> 
        <td><input id="agid" type="text" 
           name="contactid" onkeyup="ajaxFunction(event)"></td> 
       </tr> 
       <tr> 
        <td>Tel Number:</td> 
        <td><input id="agtel" type="text" 
           name="contacttel"></td> 
       </tr> 
       <tr> 
        <td>Name:</td> 
        <td><input id="agfn" type="text" 
           name="contactfullname"></td> 
       </tr> 
       <tr> 
        <td>Salutation:</td> 
        <td><input id="agsal" type="text" 
           name="contactsalutation"></td> 
       </tr> 
       <tr> 
        <td><input type="reset" value="Clear"></td> 
        <td></td> 
       </tr> 
      </table> 
     </form> 

    </body> 
</html> 
+0

那麼你的問題是什麼,你的代碼不工作? –

+0

@Kanishka tq for reply。我試圖用JS添加異常,但它不適合我。雖然'聯繫人ID'在數據庫中,但彈出窗口出來了。所以我從索引中刪除該代碼。任何想法來驗證ID? – atiquratik

+0

我相信'e.target || e.srcElement'會給你一個TRUE/FALSE值。但是你試圖在代碼中訪問它的value屬性。 –

回答

2

以下是我將如何使用jQuery進行基本驗證。

$(document).ready(function(){ 
    $('#contact').keypress(function(e){ //when user presses a key in that Input Box 
     var code = (e.keyCode ? e.keyCode : e.which); 
     if(code == 13) // check if it is Enter Key 
     { 
     if($(this).val().trim().length == 0) // check if it is empty 
      alert("Error: Shouldn't be empty !"); 
     else 
     { 
      // You are good to go here 
     } 
     } 
    }); 
});​ 

HTML:

<input id="contact" name="contact" value="" />​ 

如果你想現場測試,轉到:http://jsfiddle.net/NFSTL/

我綁定了KeyPress事件到的InputBox。

希望它有幫助。 :)


編輯

不使用jQuery:

function ajaxFunction(e){ 
    var code; 
    if (!e) var e = window.event; 
    if (e.keyCode) code = e.keyCode; 
    else if (e.which) code = e.which; 

    if (e.target) targ = e.target; 
    else if (e.srcElement) targ = e.srcElement; 
    if (targ.nodeType == 3) // defeat Safari bug 
     targ = targ.parentNode; 

    if(code==13) 
    { 
     if(targ.value.trim().length == 0) 
      alert("Error: This shouldn't be empty!"); 
     else 
     { 
      //do the sending and receiving of data here... 
     } 
    } 
}​ 

HTML:

<input id="agid" type="text" name="contactid" onkeyup="ajaxFunction(event)" />​ 

對於實時測試:http://jsfiddle.net/SYf4C/

這裏有一個很好的教程我使用:quirksmode.org/js/events_properties

我會說,jQuery使生活更輕鬆。 :) 因爲它是一個JavaScript庫,幾乎適用於所有瀏覽器。

+0

感謝@Akhilesh爲你的答案:)但有沒有其他方式,而不是使用jQuery ? – atiquratik

+0

我編輯了我的答案。覈實。 –

+0

優秀!!非常感謝@Akhilesh :)但如果用戶輸入錯誤的ID如何顯示錯誤味精? [I,E。在數據庫中找不到ID] – atiquratik

1

主頁編碼:

$('.vote').click(function() { 
     var valueid=$(this).attr("alt"); 
     $.ajax({ 
      type: "POST", 
      url: "voteajax.php", 
      data: "votebtn="+valueid+"" 
     }).done(function(msg) { 
      var received_data=msg.trim(); 
      if(received_data=='0') 
      { 
       alert('Please sign in to vote!'); 
      } 
      else 
      { 
       alert('received data'+received_data); 
       gg2=received_data.split("/"); 
       var x=gg2[0]; 
       var no_of_vote=gg2[1]; 
       $('#totalnoofvotespan').html(no_of_vote); 
       window.location='<?php echo $_SERVER['REQUEST_URI']; ?>'; 
      } 
     }); 


//Ajax Page Coding 


    $poll_choice = $_POST['votebtn']; 
    $userid=$_SESSION['userid']; 
    $date=date('Y-m-d h:i:s'); 
    $ex=explode(",",$poll_choice); 
    $pollid=$ex[0]; 
    $choiceid=$ex[1]; 
    if($userid=="") 
    { 
     echo "0"; 
    } 
    else 
    { 
     ..// Your coding 
     echo $choiceid."/".$numofvote; // Echo the identifier and access this identifier in main page for message notification 
    } 

第一個是編碼 在上述編碼我傳遞參數Ajax頁面的主頁面。在ajax頁面中,它從主頁面獲取值,如果它無效,它會回顯標識碼。使用該代碼,我們可以說「這不是一個有效的」。像這樣你必須嘗試。我認爲這可能會幫助你

+1

我認爲,如果你在代碼上做了一些縮進,那麼觀衆很容易閱讀。 –

+1

當然,我會這樣做 – Rithu

+0

@sindhu 我沒有得到你在這裏做了什麼..對我來說似乎很複雜:( – atiquratik