2016-08-20 88 views
0

我正在開發一個Django應用程序,我正在使用jquery自動完成。我知道這個問題在這裏已經有好幾次了,但是沒有一個解決方案適用於我。我下面這個教程:http://flaviusim.com/blog/AJAX-Autocomplete-Search-with-Django-and-jQuery/Django jquery自動完成給出錯誤

我在報頭包含此:

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.18/themes/base/jquery-ui.css" type="text/css" media="all" /> 
在此以相同的順序

然後在我的頁面

,我已經使用:

{% extends "account/base.html" %} 

{% load i18n %} 
{% load bootstrap %} 

{% block body_class %}applications{% endblock %} 

{% block head_title %}{% trans "Change password" %}{% endblock %} 

{% block body %} 




<form action="/create_recipe_rule/{{ recipe_pk }}/" method="post"> 
{% csrf_token %} 





<div class="form-group ui-widget"> 
<label for="{{ form.content.label }}">{{ form.content.label }}:</label> 
<textarea type="{{ form.content.type }}" name="{{ form.content.name }}" max_length="500" class="form-control" id="recipe_rule_content"></textarea> 
</div> 

<script> 
$(function() { 
    $("#recipe_rule_content").autocomplete({ 
    source: "/api/get_RuleStatement/", 
    minLength: 2, 
    }); 
}); 
</script> 


    <input class="btn btn-default" type="submit" value="submit"> 
</form> 
{% endblock %} 

任何人都可以建議我哪裏錯了嗎?

這是我得到的控制檯錯誤:

uncaught TypeError: $(...).autocomplete is not a function

回答

0

它看起來像裝jQueryUI之前執行你的代碼。

移動你

<script> 
$(function() { 
    $("#recipe_rule_content").autocomplete({ 
    source: "/api/get_RuleStatement/", 
    minLength: 2, 
    }); 
}); 
</script> 

<head>

<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 

編輯

code.jquery.com有證書有問題。嘗試cdnjs

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.js"></script> 
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script> 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.8.18/themes/base/jquery-ui.css"> 
+0

我試過了,還是讓同樣的錯誤:( – Elisha512

+0

我想你的編輯,它仍然同樣的問題:(指數):152遺漏的類型錯誤:$(...)自動完成不是功能 – Elisha512