在输入文本中搜索然后使用Ajax PHP搜索结果将是下拉列表

时间:2016-12-14 09:35:59

标签: javascript php jquery ajax

应该有一个输入文本框,如果用户写任何文本,它应该显示客户名称的下拉列表

<script>
    function custlist() {
        $.ajax({
            url: "custlist.php",
            success: function(result) {
                $("#customerlist").html(result);
            }        
        });
    }
    function showCustomers(str) {
        $.ajax({
            type: "GET",
            url: "customerlist.php",
            data:'q='+str,
            success: function(result) {
                $("#customerlist").html(result);   
            }        
        });
    }
</script>

<input type="text" oninput="showCustomers(this.value)" placeholder="Search here" name="CustomerNo" /> 
<select name="Cno" id="customerlist" onfocus="custlist()">
    <option value="">Customer Name</option>
</select>

custlist.php

<?php
    $sql2 = 'SELECT Customer_Name as Cname,No from customers order by Customer_Name';
    $result2 = mysqli_query($connection, $sql2);

    if (mysqli_num_rows($result2) > 0) { ?>
        <option value="">Customer Names</option>                
        <?php // output data of each row
            while($row2 = mysqli_fetch_assoc($result2)) { ?>
                <option value="<?php echo $row2['No']; ?>"><?php echo $row2["Cname"]; ?>
                </option>
        <?php } ?>
<?php } ?>

customerlist.php

<?php          
    $q = $_REQUEST["q"];
    // lookup all hints from array if $q is different from ""
    if ($q !== "") {
        $sql2 = "SELECT Customer_Name as Cname,No from customers where Customer_Name like '".$q."%s' order by Customer_Name";
        $result2 = mysqli_query($connection, $sql2);

        if (mysqli_num_rows($result2) > 0) { ?>
            <option value="">Customer Names</option>                
            <?php // output data of each row
                while($row2 = mysqli_fetch_assoc($result2)) { ?>
                    <option value="<?php echo $row2['No']; ?>"><?php echo $row2["Cname"]; ?>
                    </option>
            <?php } ?>
    <?php } ?>
<?php } ?>

我在下拉列表中获取数据,但如果我在文本框中写入内容,我希望自动显示匹配该字符的下拉列表。

我还有一个问题......

第二期: - 当我首先键入“abd”时,它会显示以“abd”开头的客户名称,但会自动显示以“ab”开头的名称,然后是“a”,然后为空。 那是为什么?

提前致谢。

1 个答案:

答案 0 :(得分:0)

而不是 使用Javascript:

$.ajax({
    type: "GET",
    url: "customerlist.php",
    data:'q='+str,
    success: function(result){
        $("#customerlist").html(result);
    }  
});

和php:

<?php

$q = $_REQUEST["q"];

尝试使用此Javascript:

$.ajax({
    type: "POST",
    url: "customerlist.php",
    data: {q: str},
    success: function(result){
        $("#customerlist").html(result);
    } 
});

和php:

<?php

$q = $_POST['q'];

希望这有帮助!