Django的提前输入自动完成
base.htmlDjango的提前输入自动完成,django,django-views,bootstrap-typeahead,Django,Django Views,Bootstrap Typeahead,base.html <html lang=en> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link type="text/css" rel="stylesheet" href="/media/js/autocomplete.css"> <script type="text/javascript" src=
<html lang=en>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="/media/js/autocomplete.css">
<script type="text/javascript" src="/media/js/jquery-1.2.1.js"></script>
<script type="text/javascript" src="/media/js/dimensions.js"></script>
<script type="text/javascript" src="/media/js/autocomplete.js"></script>
{% block extra_css %}{% endblock extra_css %}
<title>{% block title %}books are social{% endblock title %}</title>
</head>
<body>
{% block body %}
{% endblock body %}
</body>
</html>
from django.conf.urls.defaults import *
urlpatterns = patterns('project.app.views',
(r'^/lookup/$', 'book_lookup'),
)
class Book(models.Model):
name = models.CharField(max_length=200)
from django.utils import simplejson
from django.http import HttpResponse
from project.app.models import Book
def book_lookup(request):
# Default return list
results = []
if request.method == "GET":
if request.GET.has_key(u'query'):
value = request.GET[u'query']
# Ignore queries shorter than length 3
if len(value) > 2:
model_results = Book.objects.filter(name__icontains=value)
results = [ {x.id :x.name,} for x in model_results ]
json = simplejson.dumps(results)
return HttpResponse(json, mimetype='application/json')
from django.conf.urls.defaults import *
urlpatterns = patterns('project.app.views',
(r'^/lookup/$', 'book_lookup'),
)
class Book(models.Model):
name = models.CharField(max_length=200)
from django.utils import simplejson
from django.http import HttpResponse
from project.app.models import Book
def book_lookup(request):
# Default return list
results = []
if request.method == "GET":
if request.GET.has_key(u'query'):
value = request.GET[u'query']
# Ignore queries shorter than length 3
if len(value) > 2:
model_results = Book.objects.filter(name__icontains=value)
results = [ {x.id :x.name,} for x in model_results ]
json = simplejson.dumps(results)
return HttpResponse(json, mimetype='application/json')
<input id="book_lookup" class="search-query typeahead" data-items="4" type="text"
placeholder="Select here....">
如何将数据源更改为book_lookup json视图？我以前使用过Bootstrap的typeahead，我所做的是创建一个通过Ajax获取字典的方法，如下所示：
<script type="text/javascript">
var typeahead_data = [];
function get_client_names() {
$.ajax({
url: "/lookup",
success: function (data) {
$.each(data, function (key, value) {
typeahead_data.push(value.toString());
});
// assign the array to my typeahead tag
$('.typeahead').typeahead({
source: typeahead_data,
});
}
});
}
$(function () {
get_client_names();
});
</script>
<input id="book_lookup" class="search-query typeahead" data-items="4" type="text"
placeholder="Select here....">
var typeahead_数据=[]；
函数get_client_names（）{
$.ajax({
url:“/lookup”，
成功：功能（数据）{
$。每个（数据、函数（键、值）{
typeahead_data.push（value.toString（））；
});
//将数组分配给我的typeahead标记
$（'.typeahead'）。typeahead({
资料来源：typeahead_数据，
});
}
});
}
$（函数（）{
获取客户端名称（）；
});
<script type="text/javascript">
var typeahead_data = [];
function get_client_names() {
$.ajax({
url: "/lookup",
success: function (data) {
$.each(data, function (key, value) {
typeahead_data.push(value.toString());
});
// assign the array to my typeahead tag
$('.typeahead').typeahead({
source: typeahead_data,
});
}
});
}
$(function () {
get_client_names();
});
</script>
<input id="book_lookup" class="search-query typeahead" data-items="4" type="text"
placeholder="Select here....">
/lookup/[name1，name2，name3…]希望这对你有用 在Paulo的回答中，他只是有一个静态的要搜索的项目列表，这就是为什么他在加载时调用ajax，然后获取列表并将其添加到源代码中 在您的情况下，我认为，您需要查询任何用户类型，并将其发送到服务器。这可以通过在数据源中添加函数param来实现，该函数获得两个参数，查询和回调
只需尝试
数据源='/lookup/'是\u ajax（）$。ajaxGET