[英]Call PHP Script from Auto-complete AJAX JQuery Mobile
我有以下自动完成的代码,可通过AJAX调用PHP文件并以JSON格式获取结果:
$( "#autocomplete_customer" ).on( "listviewbeforefilter", function ( e, data ) {
var $ul = $( this ),
$input = $( data.input ),
value = $input.val(),
html = "";
$ul.html( "" );
if ( value && value.length > 0 ) {
$ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
$ul.listview( "refresh" );
$.ajax({
url: "SearchCustomer.php",
dataType: "jsonp",
crossDomain: true,
data: {
term: $input.val()
}
})
.then( function ( response ) {
$.each( response, function ( i, val ) {
html += "<li>" + val + "</li>";
});
$ul.html( html );
$ul.listview( "refresh" );
$ul.trigger( "updatelayout");
});
}
});
这是SearchCustomer.php文件:
<?php
include "config.php";
mysql_select_db($db, $con);
$search = $_GET['term'];
$result = mysql_query("my SELECT query on basis of $search") or die('Something went wrong');
$json = '[';
$first = true;
while ($row = mysql_fetch_assoc($result))
{
if (!$first) { $json .= ','; } else { $first = false; }
$json .= ".$row['cli_razon_social'].";
}
$json .= ']';
echo $json;
?>
我面临两个问题:
结果没有从PHP文件返回,或者我做错了。 请帮助我修复它。
当前,用户无法从自动完成列表中选择一个值。 如何修改此脚本,以允许用户从文本字段自动完成ul
列表中选择自动完成值?
谢谢。
您需要准备一个json对象,以便从您的PHP文件发送。
看看json_encode()
。
理想情况下,您将准备一个关联数组,然后将其转换为JSON
例如
$arr = array();
$arr['name'] = 'PHP';
echo json_encode($arr);
产量
{
'name' : 'PHP'
}
然后,您可以将JS中的名称引用为
.then(function(resp) { console.log(resp.name); }
这将在控制台中输出PHP
。
但是,使用内置于自动完成功能的jQuery UI可能会更好。 请参考这篇文章 。
此外,您的代码容易受到SQL注入的攻击。 您应该切换到“预备语句”以避免这种情况。
更新:
至于第二个问题,您可以先为列表项分配一个类,例如<li class="autocomp-data">
,然后将一个单击处理程序绑定到<li class="autocomp-data">
。
$ul.html( html );
$('.autocomp-data').click(function() {
$('correct-selector').val($(this).text());
});
请注意,根据您要分配文本的位置,可能需要使用.val()
或.html()
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.