2011-02-11 129 views
0

我最近偶然發現了一個小問題。基本上我想給我的用戶搜索通網站上的某個特定類別的能力,但搜索是通過AJAX做並不會重新加載頁面,簡單地被引導通過搜索的內容。AJAX幫助需要

以下代碼是我到目前爲止所提出的,但唯一一次它會改變的是當文本框中沒有值時,除了內容沒有被更新(我檢查了PHP文件手動並沒有誤差修改&與Firefox的HTTP直接插件我確信調用我的PHP文件由)

我的代碼:

category.php:

<script type="text/javascript"> 
function showCat(str, cat) 
{ 
if (str=="") 
    { 
    document.getElementById("showCategory").innerHTML=""; 
    return; 
    } 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("showCategory").innerHTML=xmlhttp.responseText; 
    } 
    } 
    url="../cat_search.php?q="+str+"&cat="+cat 

xmlhttp.open("GET",url,true); 
xmlhttp.send(); 
} 
</script> 
<input type="text" name="showCat" onkeyup="showCat(this.value, <?=$id?>)" style="width: 140px;" /> 

    <div id="showCategory"> 
    ## Stuff is being listed here on the load of the page & then should be updated with Ajax 

    </div> 

cat_search.php :

<?php 
include("config.php"); 
include("global.php"); 

$q=$_GET["q"]; 
$cat=$_GET["cat"]; 

$search = $q; 
$q = "%".$q."%"; 

$sql="SELECT * FROM games WHERE title like '$q' AND category = '$cat'"; 
$result = mysql_query($sql); 

if(mysql_num_rows($result) == 0) { 
echo "<center><div class=\"redbox\" style=\"width: 110px;\">No match</div></center>"; 
} 

while($row = mysql_fetch_array($result)) { 
echo '......'; 
} ?> 

$ id是實際的類別ID。

讓我知道,如果你會的我的問題可能是什麼slighest想法,我使用幾乎相同的確切代碼爲另一種類型的搜索,它就像一個魅力。

謝謝你!

+0

你能使用Firebug(Firefox附加組件),以瞭解Ajax請求,因爲它們發生 - 這會給你的js錯誤,以及當AJAX請求是和未被髮送時顯示你。 – 2011-02-11 23:36:46

+2

如果你搜索```會發生什麼? – RobertPitt 2011-02-12 00:09:34

回答

1

使用jQuery的AJAX。認真。這是非常簡單和痛苦的。那是WTH嗎?

$q=$_GET["q"]; 
$search = $q; 
$q = "%".$q."%"; 

爲什麼不只是?

$q = '%'.$_GET['q'].'%'; 

而且,例如,在jQuery的代碼:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('input[name=showCat]').keyup(function(){ 
      showCat($(this).val(),$(this).attr('id')); 
     }); 
    }); 
    function showCat(str,cat) { 
     if (str == '') { 
      $('#showCategory').html(''); 
      return; 
     } else { 
      $.get('../cat_search.php',{q:str,cat:cat},function(data){ 
       $('#showCategory').html(data); 
      }); 
     } 
    } 
</script> 

<input type="text" name="showCat" id="<?=$id?>" style="width: 140px;" /> 
<div id="showCategory"> 
    ## Stuff is being listed here on the load of the page & then should be updated with Ajax 
</div>