根据下拉选择限制自动完成的结果数

时间:2013-04-23 16:45:17

标签: php jquery sql ajax autocomplete

我正试图在这里弄清楚几件事情,似乎非常接近,但遇到了障碍。我的问题是,在我选择一个下拉选项(用于过滤大量结果)之后,当我开始在自动完成框中输入时应该可用的结果不可用。如果我硬编码下拉列表正在传递的值并开始在自动填充框中输入,那么一切正常。只有当我传递这个价值时,我才会遇到这个问题。

我有两个PHP页面,其中一个包含布局,其中包括一个下拉列表(结果为SQL)和一个自动完成框,另一个包含自动完成的SQL。

的search.php

<select id="loc">
<?php
// sql for dropdown
while ($row = odbc_fetch_array($result)) {
echo "<option value\"".$row['Location']"\">".$row['Description']."</option>";
}
?>
</select>

<label for="search">Search: </label>
<input type="text" id="search" />

<script>
// Send value entered in the autocomplete box to data.php for it to be used in sql statement
$(document).ready(function(){
    $('#search').autocomplete({
        minLength: 3,
        source: function(query, process) {
            $.ajax({
                url: 'data.php',
                type: 'GET',
                data: "name=" + $('#search').val(),
                dataType: 'JSON',
                async: true,
                success: function(data) {
                    process(data);
                }
            });
        }
    });
});

// Append selected dropdown value to URL so it can be accessed
$(document).ready(function() {
    $('#search').change(function() {
        var res = $(this).val();
        location.href = "search.php?src="+res;
    });
});
</script>

data.php

<?php
if (isset($_GET['src'])) {
$loc = $_GET['src'];
$fullname = explode(" ", $_GET['name']);
$sql = "SELECT p.lastname + ', ' + p.firstname as fullname,
        l.city as city
        FROM people p
        JOIN location l on p.city = l.city
        WHERE p.lastname like '".$fullname[1]."%' AND p.firstname like '".$fullname[0]."%'
        AND l.city = '$loc'
        GROUP BY p.lastname + ', ' + p.firstname, l.city
        ORDER BY p.lastname + ', ' + p.firstname";

// DB connection and execute connection here

$array = array();
while ($row = odbc_fetch_array($db)) {
    $array[] = $row['fullname'];
}
echo json_encode($array);
}
?>


因此,当我拥有这样的代码并从下拉列表中选择一个选项时,它将通过select语句运行,因为所选的值正在传入。如果我在search.php页面上回显结果,它们会被正确过滤或者如果我直接导航到data.php页面并传递正确的参数一切正确。在我做出选择之后,并开始在自动填充框中输入内容,我没有得到任何结果。我猜我需要以某种方式根据选择过滤结果,得到那些结果并在我开始输入时运行不同的查询?

在此先感谢您的帮助,如果我不清楚,请告诉我。

1 个答案:

答案 0 :(得分:0)

就像它通常发生的那样,在休息之后我现在已经开始工作了。

下面是修改后的代码,其中的注释显示了我的更改。

的search.php

<select id="loc">
<?php
// sql for dropdown
while ($row = odbc_fetch_array($result)) {
echo "<option value\"".$row['Location']"\">".$row['Description']."</option>";
}
?>
</select>

<label for="search">Search: </label>
<input type="text" id="search" />

<script>
/* Send value entered in the autocomplete box to data.php 
 * for it to be used in sql statement */
$(document).ready(function(){
    $('#search').autocomplete({
        minLength: 3,
        source: function(query, process) {
// Added the variable below to get the dropdown's selected value
            var res = $('#loc').val();
            $.ajax({
                url: 'data.php',
                type: 'GET',
// Edited: included the dropdown value 
                data: "src="+res + "&name=" + $('#search').val(),
                dataType: 'JSON',
                async: true,
                success: function(data) {
                    process(data);
                }
            });
        }
    });
});

/* This event is not needed since the value is set when a selection 
 * is made. 'change' passed that value to search.php causing
 * the query to run without the search value. This caused a HUGE 
 * number of results, and usually causing the page to timeout. 
 * Making sure all variables get passed prior to running the query
 * is a must. I knew this but got stuck on how to make it work. */
// Append selected dropdown value to URL so it can be accessed
//$(document).ready(function() {
//    $('#search').change(function() {
//        var res = $(this).val();
//        location.href = "search.php?src="+res;
//    });
//});
</script>

data.php

<?php
if (isset($_GET['src'])) {
    $loc = $_GET['src'];
}
// Moved the $loc variable into the if statement above
// $loc = $_GET['src'];
$fullname = explode(" ", $_GET['name']);
$sql = "SELECT p.lastname + ', ' + p.firstname as fullname,
        l.city as city
        FROM people p
        JOIN location l on p.city = l.city
        WHERE p.lastname like '".$fullname[1]."%' 
              AND p.firstname like '".$fullname[0]."%'
        AND l.city = '$loc'
        GROUP BY p.lastname + ', ' + p.firstname, l.city
        ORDER BY p.lastname + ', ' + p.firstname";

// DB connection and execute connection here

$array = array();
while ($row = odbc_fetch_array($db)) {
    $array[] = $row['fullname'];
}
echo json_encode($array);
?>


我还没有完成主页上的几个部分,例如禁用/隐藏自动完成框,直到从下拉列表中进行选择并调整查询以进行其他过滤,但这些是我列表中的下一个。我确信还有其他一些我可以清理的东西,但我的第一个目标是让它正常工作,现在已经完成了!

如果有人使用PHP并且有几十万+结果,并且想要使用自动完成框来过滤那些而不等待显示结果的荒谬时间,我希望这可能会有所帮助。不像我最初想象的那么复杂,但过度思考它会对你做到这一点。此外,即使它现在正在工作,随时为任何语法错误添加一些建议和道歉!