在我的最後一個問題中,原來typeahead.js可能更新了typeahead autocomplete suggestion with ajax doesn't work。在bootstrap tags input有一些例子,所以基於我的第一個問題和例子的一些代碼,我用下面的代碼出來了。 當我鍵入例如s
我得到下拉Sandra
自我暗示,但是當我點擊它,我每一次得到這個錯誤: Uncaught TypeError: (str || "").replace is not a function
bootstrap標籤輸入typeahead throws(str ||「」).replace不是函數
的test.html
<html lang="en">
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="/static/bootstrap.min.css">
<link rel="stylesheet" href="/static/bootstrap-theme.min.css">
<link rel="stylesheet" href="/static/bootstrap-tagsinput.css">
</head>
<body>
<input type="text" data-role="tagsinput" >
<script src="../static/jquery.min.js"></script>
<script src="../static/bootstrap.min.js"></script>
<script src="../static/typeahead.bundle.js"></script>
<script src="../static/bootstrap-tagsinput.js"></script>
<script>
var citynames = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: '/test/?query=*',
wildcard: '*',
filter: function(x) {
return $.map(x, function(item) {
console.log(item) //["Sandra"]
return {name: item};
});
},
},
});
citynames.initialize();
$('input').tagsinput({
itemValue: 'name',
typeaheadjs: {
name: 'citynames',
displayKey: 'name',
source: citynames.ttAdapter()
}
});
</script>
</body>
</html>
app.py
from flask import Flask, render_template, url_for, jsonify, request
app = Flask(__name__)
@app.route('/', methods=['GET','POST'])
def index():
return render_template('test.html')
@app.route('/test/', methods=['GET', 'POST'])
def test():
names = ["John","Jane", "Sandra", "Xerox"]
query = request.args.get('query')
return jsonify(options=[name for name in names if query.lower() in name.lower()])
if __name__ == '__main__':
app.run(debug = True)