构建自动建议文本框

时间:2016-01-23 03:34:05

标签: javascript php jquery mysql

我正在尝试构建一个简单的自动建议输入栏,它连接到MySql数据库并检索数据。我遇到的问题是当我输入我知道存在于数据库中的对象的名称时,文本栏不会返回任何结果,而只是它提供了一个空的下拉列表框。

我能说的最好,问题与代码的PHP部分中使用的javascript有关。不幸的是,我似乎无法弄清楚它为什么会导致问题。

    <?php
    mysql_connect("host", "user", "passsword") OR DIE ('Unable to connect to database! Please try again later.');
    mysql_select_db('DBName');
    $query = 'SELECT Device_type FROM Device';
    $result = mysql_query($query);
    $counter = 0;
    echo"<script type='text/javascript'>";
    echo"this.nameArray = new Array()";
    if($result) {
        while($row = mysql_fetch_array($result)) {
            echo("this.nameArray"  .$row ['Device_type'] . "';");
            $counter += 1;
        }
    }
    echo("</script>");
    ?>

当我取出echo"<script type='text/javascript'>";echo"this.nameArray = new Array()";时,它会在页面加载时在页面顶部显示Device_type内容。这显然不是我想要的,但它确实证明数据库连接至少是正确设置的。由于PHP的这一部分是指一些javascript,我还将证明它所引用的功能。

    function doSuggestions(text) {
        var input = text;
        //window.alert(text);
        var inputLength = input.toString().length;
        var code = "";
        var counter = 0;
        while(counter < this.nameArray.length) {
            var x = this.nameArray[counter]; // avoids retyping this code a bunch of times
            if(x.substr(0, inputLength).toLowerCase() == input.toLowerCase()) {
                code += "<div id='" + x + "'onmouseover='changeBG(this.id);' onMouseOut='changeBG(this.id);' onclick='doSelection(this.innerHTML)'>" + x + "</div>";
            }
            counter += 1;
        }
        if(code == "") {
            outClick();
        }
        document.getElementById('divSuggestions').innerHTML = code;
        document.getElementById('divSuggestions').style.overflow='auto';
    }

当我开始输入时,有关建议框为何没有提供建议的任何建议?如果我在文本框中输入A,则会出现一个建议框,显示数据库中以A开头的所有项目。

1 个答案:

答案 0 :(得分:0)

你的js字符串中有一些错误

 `echo"var nameArray = new Array()";`
 `echo("nameArray.push('"  .$row ['Device_type'] . "');");`

这样您就可以将设备类型推送到nameArray var。