代码之家 › 专栏 › 技术社区 › HWM-Rocker

jquery自动完成不适用于我的django应用程序

jquery-autocomplete django

HWM-Rocker · 技术社区 · 16 年前

http://code.google.com/p/jquery-autocomplete/ )一个似乎非常有用和容易。对于django部分,我使用这个( http://code.google.com/p/django-ajax-selects/ )我看起来有点红,因为有点红。每个新行有2'\n',响应中没有内容长度标题。首先我认为这可能是个问题,因为我在网上找到的所有例子都有。但这不是问题所在。

我有一个非常小的test.html,主体如下:

<body>
<form action="" method="post"> 
<p><label for="id_tag_list">Tag list:</label> 
<input id="id_tag_list" name="tag_list" maxlength="200" type="text" /> </p> 
<input type="submit" value="Submit" /> 
</form> 
</body>

这是JQuery调用,用于将自动完成添加到输入中。

function formatItem_tag_list(row) {
    return row[2]
}
function formatResult_tag_list(row) {
    return row[1]
}

$(document).ready(function(){
    $("input[id='id_tag_list']").autocomplete({
        url:'http://gladis.org/ajax/tag',
        formatItem: formatItem_tag_list,
        formatResult: formatResult_tag_list,
            dataType:'text'
    }); 
});

(这个问题已经解决,ajax的一个安全特性是不从另一个域获取数据)

http://gladis.org/ajax/tag?q=Bi&max ... 是生成的。当您在浏览器中输入此信息时,您会得到以下响应:

4|Bier|Bier
43|Kolumbien|Kolumbien
33|Namibia|Namibia

现在,我的ajax调用得到了正确的响应,但是仍然没有显示包含所有可能条目的列表。我还试图格式化输出,但这也不起作用。我将brakepoints设置为函数,并意识到它们根本不会被调用。

这里是我的最小HTML文件的链接 http://gladis.org/media/input.html

有人知道我做错了什么吗。我还上传了所有的文件作为一个小zip在 ~~http://gladis.org/media/example.zip~~

[编辑]

(r'^ajax/(?P<channel>[a-z]+)$', 'ajax_select.views.ajax_lookup'),

以及ajax查找通道配置

AJAX_LOOKUP_CHANNELS = {
    # the simplest case, pass a DICT with the model and field to search against :
    'tag' : dict(model='htags.Tag', search_field='text'),
}

以及以下观点:

def ajax_lookup(request,channel):
    """ this view supplies results for both foreign keys and many to many fields """

    # it should come in as GET unless global $.ajaxSetup({type:"POST"}) has been set
    # in which case we'll support POST
    if request.method == "GET":
        # we could also insist on an ajax request
        if 'q' not in request.GET:
            return HttpResponse('')
        query = request.GET['q']
    else:
        if 'q' not in request.POST:
            return HttpResponse('') # suspicious
        query = request.POST['q']

    lookup_channel = get_lookup(channel)

    if query:
        instances = lookup_channel.get_query(query,request)
    else:
        instances = []

    results = []
    for item in instances:
        results.append(u"%s|%s|%s" % (item.pk,lookup_channel.format_item(item),lookup_channel.format_result(item)))

    ret_string = "\n".join(results)
    resp = HttpResponse(ret_string,mimetype="text/html")
    resp['Content-Length'] = len(ret_string)
    return resp

4 回复 | 直到 16 年前

Daniel Roseman 16 年前

您可能需要在URL的末尾添加一个尾随斜杠。

另外,jQuery选择器是错误的。您不需要方括号内的引号。但是,该选择器最好是这样编写的:

$("input#id_tag_list")

或者只是

$("#id_tag_list")

Daniel Roseman 16 年前

单独回答,因为我刚刚考虑了另一种可能性:您的静态页面是否与Ajax调用(gladis.org)来自同一个域?否则,相同的域策略将阻止加载Ajax。

Brian Luft 16 年前

另外,假设document.ready在Django模板中,最好使用{%url%}标记,而不是硬编码url。

$(document).ready(function(){
    $("input[id='id_tag_list']").autocomplete({
        url:'{% url my_tag_lookup %}',
        dataType:'text'
    }); 
});

HWM-Rocker 16 年前

我找到了一个解决方案,但我仍然不知道为什么第一种方法没有奏效。我刚换了一个图书馆。我选择 http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ . 这一个实际上是由jQuery提升的,它可以工作;)