PHP的AJAX自动完成表单MySQL数据库 [英] php ajax autocomplete form mysql database
本文介绍了PHP的AJAX自动完成表单MySQL数据库的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
您好所有我已经成功地achived我自动完成表单，但问题是，结果是没有相应的时候，我们刚刚退格它。 这是我的code ..
Hello all i have sucessfully achived my auto complete form but the problem is that the results are not accordingly when we just backspace it . this is my code ..
<html>
<head>
<title>Live Search Ajax Example</title>
<script language="javascript" type="text/javascript"
src="jquery-2.0.2.js">
</script>
</head>
<body>
<h1>Live Search: Ajax Example</h1>
<div class="content">
<input type="text" class="search" id="searchid" placeholder="Search for people" /> Ex:arunkumar, shanmu, vicky<br />
<div id="result"></div>
</div>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$(function(){
$(".search").keyup(function()
{
var searchid = $(this).val();
var dataString = 'search='+ searchid;
if(searchid !='')
{
$.ajax({
type: "POST",
url: "search.php",
data: dataString,
cache: false,
success: function(html)
{
$("#result").html(html).show();
}
});
}return false;
});
jQuery("#result").live("click",function(e){
var $clicked = $(e.target);
var $name = $clicked.find('.name').html();
var decoded = $("<div/>").html($name).text();
$('#searchid').val(decoded);
});
jQuery(document).live("click", function(e) {
var $clicked = $(e.target);
if (! $clicked.hasClass("search")){
jQuery("#result").fadeOut();
}
});
$('#searchid').click(function(){
jQuery("#result").fadeIn();
});
});
</script>
</body>
</html>
和我的PHP页面就像
<?php
include('database.php');
if($_POST)
{
$q=$_POST['search'];
$sql_res=mysql_query("select id,name,email from fk_mem where name like '$q%' or email like '$q%' order by id LIMIT 5");
while($row=mysql_fetch_array($sql_res))
{
$username=$row['name'];
$email=$row['email'];
$b_username='<strong>'.$q.'</strong>';
$b_email='<strong>'.$q.'</strong>';
$final_username = str_ireplace($q, $b_username, $username);
$final_email = str_ireplace($q, $b_email, $email);
?>
<div class="show" align="left">
<span class="name"><?php echo $final_username; ?></span> <br/><?php echo $final_email; ?><br/>
</div>
<?php
}
}
?>
任何帮助，请..
any help please ..
推荐答案
将这个之间的＆LT; HEAD＆GT; 和＆LT; / HEAD＆GT; 把这个：
Put this between <HEAD> and </HEAD> put this:
<script src="jquery-2.0.2.js"></script>
<script>
$.customPOST = function(data,callback){
$.post('search.php',data,callback,'json');
}
$(document).ready(function() {
$(".search").keyup(function(){
$.customPOST({search: $.('#searchid').val(),function(response){
if(response.success){
var html_code = '<div class="show" style="text-align:left;">';
html_code += '<span class="name">' + response.final_username + '</span>';
html_code += ' <br/>' + response.final_email + '<br/></div>';
$("#result").text(html_code);
$("#result").show();
}
});
});
</script>
您的PHP脚本必须返回像这样一个JSON响应：
You PHP script must return a JSON response like this way :
<?php
... your code here and ....
$final_username = str_ireplace($q, $b_username, $username);
$final_email = str_ireplace($q, $b_email, $email);
// here we create and return our JSON response
$response = array('final_username' => $final_username, 'final_email' => $final_email);
echo json_encode($response);
?>
这篇关于PHP的AJAX自动完成表单MySQL数据库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
