按回車鍵後自動填充文本字段

我得到了一個有用的教程，如果你輸入'id'[或你的id的前1-2個字母]，表單的其餘部分將通過從mysql數據庫中提取數據自動填充。沒有按ENTER鍵就會發生這種事情！現在，我想要做的是，我會輸入完整的'ID'&按ENTER鍵填寫表格的其餘領域！以下代碼需要進行哪些修改？這裏是我的index.html文件：按回車鍵後自動填充文本字段

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

     function ajaxFunction(){ 
    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 name="schform"> 
      <table> 
       <tr> 
        <td>Contact ID:</td> 
        <td><input id="agid" type="text" 
           name="contactid" onKeyUp="ajaxFunction()"></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>

，這裏是我的getagentids.php文件：

<?php 

error_reporting(0); // turns off error reporting 

$con = mysql_connect("localhost", "root", ""); 
if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 
mysql_select_db("contactdetail", $con); 

mysql_select_db("contactdetail"); 

$param=$_GET['param']; 

if (strlen($param) > 0) { 
    $result = mysql_query("SELECT * FROM contact 
    WHERE contactid LIKE '$param%'"); 
    if (mysql_num_rows($result) == 1) { 
     while ($myrow = mysql_fetch_array($result)) { 
      $agentname = $myrow["contactfullname"]; 
      $agenttel = $myrow["contacttel"]; 
      $agentsal = $myrow["contactsalutation"]; 
      $agentid = $myrow["contactid"]; 
      $textout .= $agentid . ", " . $agentname . ", " . $agenttel . ", " . $agentsal; 
     } 
    } else { 
     $textout = " , , ," . $param; 
    } 
} 
echo $textout; 
?>

來源

2012-11-11 atiquratik

該功能是否在沒有輸入的情況下工作，如果是這樣，那麼您應該檢查輸入是否被按下。 –

目前它的工作沒有按下輸入！但我想填寫表單的字段輸入ID然後按Enter鍵！ – atiquratik

您是否想在按下回車鍵之後以及在您致電/發送ajax請求之前填寫輸入內容？ –

你可以改變你ajaxFunction一樣（只是將代碼粘貼在您的ajaxFunction頂部）

function ajaxFunction(e){ 
    var e=e || window.event; 
    var keycode=e.which || e.keyCode; 
    if(keycode!==13 || (e.target||e.srcElement).value=='') return false; 
    // rest of your code 
}

，改變你的onKeyUp這個（在參數通知event）

<input id="agid" type="text" name="contactid" onKeyUp="ajaxFunction(event)">

Just for an idea。

來源

2012-11-11 01:58:37

感謝您的回覆兄弟，但它和以前一樣做着同樣的事情。 [檢索數據沒有按ENTER鍵] – atiquratik

@Atiqur，檢查檢查的例子，它的工作，只有你按下輸入後，警報纔有效。確保你做到了正確的方式。 –

好兄弟，它是這樣的：function ajaxFunction（e）{var e = e || window.event; var keycode = e.which || e.keyCode; （keycode！== 13 ||（e.target || e.srcElement）.value ==''）{ var http; 嘗試{ http = new XMLHttpRequest（）; .......... ............ document.getElementById（'agtel'）。value = results [2]; document.getElementById（'agid'）。value = results [3]; } } \t} } – atiquratik

首先創建一個JavaScript函數，如果按下回車鍵來檢測和從內部調用ajaxFunction它：

function run(e) { 
    if (e.keyCode == 13) { 
     ajaxFunction(); 
     return false; //disable the default Enter behavior 
    } 
    return true; 
}

變化onKeyUp="ajaxFunction()"呼叫聯繫人ID文本輸入到onKeyUp="run()"

來源

2012-11-11 01:35:45

感謝評論:)我應該把ajaxFunction（）放在run（）裏面嗎？好吧，我已經把它，但沒有運氣:( – atiquratik

@Atiqur是的，使用我提供的整個JavaScript函數，只改變onKeyUp運行（），而不是ajaxFunction –

沒有運氣:(我做了喜歡--->'代碼「功能運行（E）{ 如果（e.keyCode == 13）{ 功能ajaxFunction（）{VAR HTTP; //讓Ajax成爲可能嘗試{// 歌劇8.0+，Firefox中的變量， Safari瀏覽器 HTTP =新的XMLHttpRequest（）; ........ ........ 將返回false; //禁用默認的輸入行爲 } 迴歸真實; \t} – atiquratik

按回車鍵後自動填充文本字段

回答

相關問題