基於Ajax的搜索PHP

我想在PHP中創建一個基於AJAX的搜索。我迄今爲止編寫的代碼現在似乎沒有起作用。任何建議都會有很大的幫助。提前致謝。這是我的代碼。基於Ajax的搜索PHP

的index.php

<head> 
<script src = "http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 

<body> 

<input type="text" name="text" id="text" autocomplete="off" onkeyup="showHint(this.value)"/> 


<div id="inner"></div> 
<script type="text/javascript"> 

function showHint(str) { 
     if(str.length == 0) { 
      document.getElementById('inner').innerHTML = "search"; 
      return; 
     } 

     if(window.XMLHttpRequest) { 
      xmlhttp = XMLHttpRequest(); 
     } else { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 

     xmlhttp.onreadystatechange = function() { 
      if(xmlhttpreadystate == 4 && xmlhttp.status == 200) { 
       document.getElementById('inner').innerHTML = xmlhttp.responseText; 
      } 
     } 

     xmlhttp.open("REQUEST", "search.php?text"+str, true); 
     xmlhttp.send(); 

    } 

</script> 

</body> 

</html>

的search.php

<?php 

    $host = 'localhost'; 
    $user = 'root'; 
    $password= 'root'; 
    $db = 'demo'; 

    @$conn = mysql_connect($host, $user, $password) or die(mysql_error()); 
    mysql_select_db($db, $conn); 

    /*if($result) { 
     echo "success"; 
    } else { echo "fail"; } 
    */ 



$text = $_REQUEST['text']; 
$text = preg_replace('#[^a-z0-9]#i', '', $text); 

$query = "SELECT * FROM users where first_name LIKE '%$text%' OR last_name LIKE '%$text%'"; 

$action = mysql_query($query); 
$result = mysql_num_rows($action); 

while($res = mysql_fetch_array($action)) { 
    $output .= $res['first_name']. ' '.$res['last_name']; 
    echo $output; 
} 


?>

來源

2015-02-09 Bishwaroop

定義「不工作」。看看你的瀏覽器的開發者工具。看看JavaScript控制檯。它報告任何錯誤嗎？看看Net標籤。請求是否被提出？它會得到迴應嗎？它們是否包含您期望的數據？ – Quentin 2015-02-09 07:25:03

爲什麼你在做這個漫長的過程，你也可以試試這個jQuery的阿賈克斯，

$.ajax({ 
     url: 'search.php', 
     type: 'GET', 
     data: 'text='+str, 
     success: function(data) { 
     //called when successful 
     $('#inner').html(data); 
     }, 
     error: function(e) { 
     //called when there is an error 
     console.log(e.message); 
     } 
    });

來源

2015-02-09 07:30:19 SagarPPanchal

nope，沒有迴應 – Bishwaroop 2015-02-09 11:20:27

檢查控制檯日誌 – SagarPPanchal 2015-02-09 11:21:34

沒有得到結果集上顯示 – Bishwaroop 2015-02-09 11:42:47

你錯過index.php中腳本中的等號（在文本之後）。

xmlhttp.open（「REQUEST」，「search.php？text =」+ str，true）;

來源

2015-02-09 08:55:25

我已更新它，它仍然無法正常工作 – Bishwaroop 2015-02-09 11:19:29

我只是在search.php中獲得輸入。你可以試試這些代碼：

的index.html：

<html> 
<head> 
</head> 
<body> 
<input type="text" name="text" id="text" autocomplete="off" onkeyup="showHint(this.value)"/> 
<div id="inner"></div> 
<script type="text/javascript"> 
function getHttpRequest() 
{ 
if(window.XMLHttpRequest) 
{ 
xmlhttp=new XMLHttpRequest(); 
} 
else 
{ 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
return xmlhttp; 
} 
function showHint(str) 
{ 
var xmlhttp; 
if (str=="") 
    { 
    document.getElementById('inner').innerHTML = "search"; 
      return; 
    } 

if (window.XMLHttpRequest) 
    { 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
       document.getElementById('inner').innerHTML = xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET", "search.php?str="+str, true); 

xmlhttp.send(); 
} 
</script> 
</body> 
</html>

的search.php：

<?php 
$text=$_GET["str"]; 
echo $text; 
?>

來源

2015-02-11 05:27:13

使用此：

$.ajax({ 
     url: 'search.php', 
     type: 'GET', 
     data: 'text='+str, 
     success: function(data) { 
     //called when successful 
     $('#inner').html(data); 
     }, 
     error: function(e) { 
     //called when there is an error 
     console.log(e.message); 
    alert(e.message); // if you dont know how to check console 
     } 
    });

來源

2015-02-11 05:41:06 parveen

基於Ajax的搜索PHP

回答

相關問題