上一篇文章,主要讲了jquery autocomplete插件调用本地数据和远程ajax查询数据的用法,但在ajax查询实现时候不是按需动态查询返回,而是把所有查询结果都返回,再通过js插件对数据进行取舍,输出到页面上。这样做的缺点就是降低了程序的性能,增加了耗时。如果返回结果是成千上万条的数据,那这个就比较笨重了。
这里我通过几种方式对程序进行了改进,以求实现性能的提升和用户体验的提升。
一、自己构造Ajax传参,不采用插件规定的extraParams
参数。
PHP控制器:
<?php
/**
*/
class pmc_try
{
public $_GP;
function __construct()
{
$this->_GP = array_merge($_GET,$_POST);
pm_tpl::assign('lang',$this->lang());
}
public function diy(){
pm_tpl::display("demo_autocomplete");
}
public function ajax_diy(){
$fid = $_GET['testfid'];
$forums = mod_forum::get_ajx_forum_by_tpid(400, $fid);
$output = json_encode($forums);
echo $output;
exit();
}
public function lang()
{
include PATH_LANG.'/common.php';
return $_LANG;
}
}
?>
Model文件:
public static function get_ajx_forum_by_tpid($tpid, $fid)
{
//产品ID:tpid,版块ID:fid
$data = array();
if($tpid && $fid){
//$sql = "SELECT name FROM sq_forums WHERE tpid='$tpid' ORDER BY threads_counter DESC";
$sql = "SELECT name FROM sq_forums WHERE tpid='$tpid' AND name LIKE N'%$fid%' ORDER BY threads_counter DESC";
$query = pm_db11::query($sql);
$data = pm_db11::fetch_all($query);
}
return $data;
}
说明:数据库N前缀是转义字符,将编码转义为 Unicode ,在服务器上执行的代码中(例如在存储过程和触发器中)显示的 Unicode 字符串常量必须以大写字母 N 为前缀。即使所引用的列已定义为 Unicode 类型,也应如此。如果不使用 N 前缀,字符串将转换为数据库的默认代码页。这可能导致不识别某些字符。例如,在前面示例中创建的存储过程可以按以下方式在服务器上执行: EXECUTE Product_Info @name = N'Chain'。使用 N 前缀的要求适用于在服务器上生成的和客户端发送的字符串常量。
html模板文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
</style>
<title></title>
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script type='text/javascript' src='./static/js/jquery-autocomplete/jquery.autocomplete.js'></script>
<script type='text/javascript' src='./static/js/jquery-autocomplete/localdata.js'></script>
<link rel="stylesheet" type="text/css" href="./static/js/jquery-autocomplete/jquery.autocomplete.css" />
</head>
<body>
<script type="text/javascript">
function initAutoComplete(json){
$("#colum").autocomplete(json , {
minChars: 0,
max: 500,
width:260,
//dataType:"json",
matchContains: true,
matchCase: false,
autoComplete: false,
autoFill: false,
scrollHeight: 220,
mustMatch: false,
formatItem: function(row, i, max) {
return row.name;
},
formatMatch: function(row, i, max) {
return row.name;
},
formatResult: function(row) {
return row.name;
}
});
}
$().ready(function() {
$("#city").focus().autocomplete(cities);
$("#colum").change(function(){
$(this).flushCache();
var fid = $("#colum").val();
var url = "http://pm.feiliu.com/?c=try&a=ajax_diy";
$.get(url,{testfid:fid},function(data){
//alert(data);
//实时返回数据,查询结果很快返回,但js解析、格式化为html比较耗时
initAutoComplete(data);
},"json");
});
})
</script>
<form autocomplete="off">
<p>
<label>城市名(调用本地文件数据):</label>
<input type="text" id="city" />
</p>
<p>
<label>飞流产品版块 (Ajax调用远程数据):</label>
<input type="text" id="colum" />
</p>
</form>
</body>
</html>
补充:
1、autocomplete 属性规定表单是否应该启用自动完成功能。
自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项。
注释:autocomplete 属性适用于 <form>,以及下面的 <input> 类型:text, search, url, telephone, email, password, datepickers, range 以及 color。
提示:在某些浏览器中,您可能需要手动启用自动完成功能。
2、MySQL数据库对于中文查询关键字不识别的解决方法首先检查文件的编码格式,看看页面顶部声明编码是不是GB2312或者UTF-8格式,声明格式一般为:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
PHP语句mysql_query("SET NAMES UTF8");
其次检查文件的物理存储编码格式,经常会默认是ansi格式造成对中文的不友好。可以通过记事本方式打开,再另存为utf-8格式。
3、数据库的编码设置问题,这时候需要修改数据库的环境变量,设置为目标格式
第一种方式是可以采用便捷的数据库管理工具,比如MySQL Administrator,查找对应菜单,操作进行设置修改。
character-set-server/default-character-set:服务器字符集,默认情况下采用该格式。
character-set-database:数据库字符集。
character-set-table:数据库表字符集。
以上优先级依次增加。所以一般情况下只需要设置character-set-server,而在创建数据库和表时不特别指定字符集,这样统一采用character-set-server字符集。
character-set-client:客户端的字符集。客户端默认字符集。当客户端向服务器发送请求时,请求以该字符集进行编码。
character-set-results:结果字符集。服务器向客户端返回结果或者信息时,结果以该字符集进行编码。
在客户端,如果没有定义character-set-results,则采用character-set-client字符集作为默认的字符集。所以只需要设置character-set-client字符集。
要处理中文,则可以将character-set-server和character-set-client均设置为GB2312,如果要同时处理多国语言,则设置为UTF8。
在执行SQL语句之前,将MySQL以下三个系统参数设置为与服务器字符集character-set-server相同的字符集。
character_set_client:客户端的字符集。
character_set_results:结果字符集。
character_set_connection:连接字符集。
设置这三个系统参数通过向MySQL发送语句:set names gb2312
第二种方法是修改MySQL配置文件my.cnf,如果是在文件中相应位置添加如下代码,以GBK编码为例,
default-character-set = gbk
########################
[client]
default-character-set = gbk
[mysqld]
default-character-set = gbk
#########################
修改结束以后,保存,然后使用客户端登录
#mysql -u root -p
在客户端中输入
>status;
则显示当前编码状态。
关于GBK、GB2312、UTF8的区别请参考其他文章。