2013-08-25 54 views
-1

自动完成功能附加到此输入字段,id =“search”。当我输入文本时,什么都没有显示出来,与在另一个文件中的另一个文本字段上使用Jquery UI日历之前显示几次的搜索结果相反。Jquery自动完成未加载

CHROME和Firefox中的Firebug开发人员控制台显示没有错误,并显示“XHR已完成加载”。我不知道哪里出了问题!请帮忙。

如default.php

<script src="jquery-1.9.1.js"></script> 
<script src="jquery-ui-1.10.3.custom.min.js"></script> 
<script src="myfunctions.js"></script> 
<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3.custom.min.css"/> 
<link rel="stylesheet" type="text/css" href="main.css"/> 

    <div id="search_container"><input type="text" onkeyup="showHint(this.value)" id="search" placeholder="Search here"/></div> 

myfunctions.js

function showHint(strvalue) 
{ 
    $("#search").autocomplete({ 
     minLength:2, 
    source: "getHint.php?search="+strvalue, 
    select:function(ui) 
       { 
        log(ui.item? 
        window.location.replace(ui.item.link): 
        "Not Found"); 
       } 
    } 
     ).data("ui-autocomplete")._renderItem = function (ul, item) { 
return $("<li></li>") 
     .data("item.autocomplete", item) 
     .append("<a>" + item.label + "</a>") 
     .appendTo(ul); 
}; 
} 

getHint.php

<?php 
require_once 'myfunctions.php'; 
$search=sanitizeString($_GET['search']); 
$query="Select * from students where firstname like '%$search%' or lastname like '%$search% order by firstname'"; 
$result= queryMysql($query); 
$k=0; 
while($row= mysql_fetch_array($result)) 
{ 
    $email=$row['email']; 
    $name=nameOf($email); 
    $studentid=studentidOf($email); 
    $as[]['label']="<a style='text-decoration:none' href='student_profile.php?studentid=$studentid'><div class='search_elements'><span class='search_elements_span'>$name</span></div></a>"; 
    $as[$k++]['value']=$name; 

} 

header('Cache-Control: no-cache, must-revalidate'); 
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT'); 
header('Content-type: application/json'); 

echo json_encode($as); 

的main.css

#search_container 
{ 
position: relative; 
top:1px; 
left:750px; 
width:250px; 

} 

#search 
{ 
font-family: cursive; 
font-size: 14px; 
color: #999999; 
width:250px; 
position:relative; 
background: white; 
z-index: 11; 
top: 1px; 
} 

#search:focus 
{ 

font-family: cursive; 
font-size: 14px; 
width: 250px; 
color: black; 
} 

浏览器中的检查代码,输入文本区域显示以下后,我搜索项目:

<input id="searchstr" class="ui-autocomplete-input" type="text" placeholder="Search here" name="searchstr" autocomplete="off"></input> 

为什么的autocomplete属性设置为“关”?

+0

你检查了AJAX请求的内容吗?标题200的响应正常并不意味着响应正常。 –

+0

@Mathletics输入文本区域的ID为'search' – kamal0808

+0

@dragoste - 是的,我已经在MySQL上手动检查了所有查询。此外,自动完成搜索一次正常,我以后没有对PHP文件进行任何更改! – kamal0808

回答

0

getHint.php需要的文件'myfunctions.php'是打印数据。如果必须以JSON的形式对数组或数据进行编码,则getHint.php文件不应该打印或“回显”任何内容。

从'myfunctions.php'中删除打印数据效果非常好。 可以通过Mozilla Firefox中的FIREBUG应用程序检查JSON编码数据。