根据数据库中的下拉值自动完成

时间:2014-02-20 05:15:47

标签: php jquery mysql ajax autocomplete

我在一周内遇到了这个问题。我在这里有下拉选择与ajax发布值到另一个下拉列表但现在我需要发布到具有自动完成功能的文本框。我需要的是连接我的自动完成查询和我的ajax,这样如果我选择例如圆珠笔,所有圆珠笔将推荐自动完成。请帮我解决一下这个。我需要完成它。

这是我的代码

Ajax.php

<script>
$(document).ready(function(){
 $("#tag").autocomplete("autocomplete.php", {
        selectFirst: true
    });
});
</script>
</head>
<body>

<br/>
 Drop1
 <?php
    $mysqli = new mysqli("localhost", "root", "", "2015");
    $combo = $mysqli->query("SELECT * FROM category GROUP BY cat_code ORDER BY id");
    $option = '';
     while($row = $combo->fetch_assoc())
        {
        $option .= '<option value = "'.$row['cat_code'].'">'.$row['category'].'</option>';
        }
    ?>

<select id="main" name="main">
<option value="" disabled="disabled" selected="selected">Choose</option>
<?php echo $option; ?>
</select>
Auto Complete <input id="tag">
<script type="text/javascript">
$('#main').change(function(){
$.ajax({
url : 'getajax.php',
data :{mainlist_id : $(this).val()},
dataType:'html',
type:'POST',
success:function(data){
$('#tag').html(data);
}
});
});
</script>

getajax.php

在这里,我将该值发布在另一个下拉列表中,但不是我需要发布到文本框中。

<?php
if (isset($_POST["mainlist_id"])) {
    $mysqli = new mysqli("localhost", "root", "", "2015");
    $main = $mysqli->real_escape_string($_POST["mainlist_id"]);


$result1 = $mysqli->query("SELECT * FROM code WHERE cat_code='$main' GROUP BY item_code ORDER BY item");

    while($row = $result1->fetch_assoc())
    {
    ?>
    <option value ="<?php echo $row['item_code'];?>"><?php echo $row['item'];?></option>';
<?php
    }
    }
?>

autocomplete.php

<?php
    //$q=$_GET['q'];
    $mysqli = new mysqli("localhost", "root", "", "2015") or die("Database Error");
    $auto = $mysqli->real_escape_string($_GET["q"]);
    //$main = $mysqli->real_escape_string($_POST["mainlist_id"]); AND cat_code='$main'
    $sql = $mysqli->query("SELECT * FROM code WHERE item LIKE '%$auto%' GROUP BY id ORDER BY item" ); 

    if($sql)
    {
        while($row=mysqli_fetch_array($sql))
        {
            echo $row['item']."\n";
        }
    }
?>

1 个答案:

答案 0 :(得分:0)

//每当你选择标签字段就会获得焦点,并且它会自动开始搜索,所以你不需要键入使用$(this).autocomplete(“search”,“”)查看回调焦点功能;和minlength 0.你必须发送主值并从这里得到响应

<script>
$(document).on("keyup", "#tag", function(){
    $("#tag").autocomplete({
        source: function(request, response) {
        $.getJSON("autocomplete_gethere.php", { main: $("#main").val() }, response);
        },
        minLength:0
        }).focus(function() {
        $(this).autocomplete("search", "");
    });
});
</script> 

     <script type="text/javascript">
        $('#main').change(function(){
        $.ajax({
        url : 'getajax.php',
        data :{mainlist_id : $(this).val()},
        dataType:'html',
        type:'POST',
        success:function(data){
        $('#tag').focus();    //please note this, here we're focusing in that input field
        }
        });
        });
        </script>

未经测试,如果有任何问题发表评论