我已经编写了一些脚本来自动填充搜索输入(来自数据库的搜索数据),并与查询一起在远程url中发送一些动态变量以进行高级搜索。

但是我没有在目标文件中接收任何数据,如果仅在“远程”中发送查询,则可以正常工作,但与远程url中的动态变量一起,则无法正常工作!请检查我的代码并指导我哪里做错了

<script src="typeahead.min.js"></script>
   <script>
$(document).ready(function(){
$('input.typeahead').typeahead({
    name: 'typeahead',
    //remote:'subtasksearch.php?key=%QUERY',
    //remote:'subtasksearch.php?key=%QUERY&&mani=123',
    remote: {
    url: 'subtasksearch.php?key=%QUERY&&mani=',
    replace: function () {
        var q = 'subtasksearch.php?key=%QUERY&&mani=';
        if ($('#country').val()) {
            q += encodeURIComponent($('#country').val());
        }
        return q;
      }
    },
    limit : 10
});
 });
</script>


我的subtasksearch.php是

<?php
$key=$_GET['key'];
$mani=$_GET['mani'];
$array = array();
$con=mysqli_connect("localhost","","","");

if (mysqli_connect_errno())
 {
   echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }


$query=mysqli_query($con, "select * from sub_task where name LIKE '%{$key}%'");
while($row=mysqli_fetch_assoc($query))
{
  $array[] = $row['name'];
  //$array[] = $mani;
}
echo json_encode($array);


我的搜索输入是

 <input type="text" name="typeahead" class="typeahead tt-query" autocomplete="off" spellcheck="false" placeholder="Type your Task" required="">


如果您使用简单的远程发送查询其工作正常

remote:'subtasksearch.php?key=%QUERY',
//or
remote:'subtasksearch.php?key=%QUERY&&mani=123',


由于远程url中的动态变量不起作用,我在控制台中观察到一些数据在URL中传递并返回空数组的情况,我想请检查一下波纹图

javascript - 无法接收目标文件Typeahead.js中的值-LMLPHP

请指导我我错了!我是用错误的方式发送值吗?

最佳答案

我认为问题在于如何发送查询变量-您正在发送原义%QUER而不是实际查询值。

url: 'subtasksearch.php?key=%QUERY&&mani=',


应该是包含变量的东西

url: 'subtasksearch.php?key='+QUERY+'&&mani=',


不确定typeahead插件,但是this.val()足以获取值,例如:

url: 'subtasksearch.php?key='+this.val()+'&mani=',


另外,请考虑使用Prepared Statements修补注入风险(即使在MySQLI中也是如此):How can I prevent SQL injection in PHP?

更新资料

因此,查看您使用的实际插件,您似乎需要为建议框配置Bloodhound,而不仅仅是单独进行预先输入。这意味着包括Bloodhound javascript源或使用捆绑软件。

<script src="http://twitter.github.com/typeahead.js/releases/latest/typeahead.bundle.min.js"> </script>
<script>
var tasks = new Bloodhound({
    remote: {
        url: 'subtasksearch.php?key=%QUERY.json',
        wildcard: '%QUERY'
    }
});

$('input.typeahead').typeahead({
    name: 'typeahead',
    source: tasks,
    limit: 10
  });
 </script>


第二次更新

我不确定Bloodhound在屏幕后面的作用,是否可以让您构造如下查询:

var country = $('#country').val()
var tasks = new Bloodhound({
    remote: {
        url: 'subtasksearch.php?key=%QUERY.json'+'&country='+country,
        wildcard: '%QUERY'
    }
});

10-06 15:17