Question

我正在尝试将twitter的typeahead自动完成插件与来自数据库的数据一起使用，但它无法正常工作。当我输入时，没有任何显示。有人可以帮助我吗？

如果我运行php页面，我将所有行都作为

 ["COOL","autocomplete","doesn't work"]

但自动完成功能不起作用。我正在使用typeahead.js 0.9.3

HTML

<input class="typeahead" type="text" data-provide="typeahead">

<script type="text/javascript" language="javascript" charset="utf-8" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" language="javascript" charset="utf-8" src="js/typeahead.min.js"></script>
<script>
    $(document).ready(function() {
    $('input.typeahead').typeahead({
        source: function (query, process) {
            $.ajax({
                url: 'data.php',
                type: 'POST',
                dataType: 'JSON',
                data: 'query=' + query,
                success: function(data) {
                    console.log(data);
                    process(data);
                }
            });
        }
    });
});
    </script>

data.php

 include_once("config.php");//database
// check connection
if ($mydb->connect_errno){
    printf("Connect failed: %s\n", $mydb->connect_error);
    exit();
}

$query = 'SELECT title FROM autocomplete';

if(isset($_POST['query'])){
    // Add validation and sanitization on $_POST['query'] here

    // Now set the WHERE clause with LIKE query
    $query .= ' WHERE title LIKE "%'.$_POST['query'].'%"';
}

$return = array();

if($result = $mydb->query($query)){
    // fetch object array
    while($obj = $result->fetch_object()) {
        $return[] = $obj->title;
    }
    // free result set
    $result->close();
}

// close connection
$mydb->close();

$json = json_encode($return);
print_r($json);

Answer 1

事实证明，我忘了包含bootstrap.js文件，一旦我这样做，它就像一个魅力。

twitter类型无法正常工作

1 个答案: