2016-07-26 40 views
8

Ich hatte Probleme bei der Verwendung dal und versuchte, ein einfaches Beispiel zu bauen.django-autocomplete-light tutorial: select2 ist kein Funktionsfehler

Ich habe fast genau das gleiche wie Django autocomplete light: field not populated und auch die Antwort des Links angewendet.

Hier sind die Schritte, die ich ging durch:

Schritt 1) ​​Wenn ich so auf Header html hinzufügen (genauso wie die obige Antwort):

<link href="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/vendor/select2/dist/css/select2.css" type="text/css" media="all" rel="stylesheet" /> 
    <link href="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/select2.css" type="text/css" media="all" rel="stylesheet" /> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/autocomplete.init.js"></script> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/select2.js"></script> 

Der Fehler der Browser-Inspektor Konsole ist wie folgt:

Uncaught ReferenceError: yl is not defined(anonymous function) @ autocomplete.init.js:75select2.js:117 
Uncaught ReferenceError: yl is not defined(anonymous function) @ select2.js:117 

Schritt 2) Also habe ich hinzugefügt jquery.js und andere js Dateien auf der dal Bibliothek:

<link href="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/vendor/select2/dist/css/select2.css" type="text/css" media="all" rel="stylesheet" /> 
    <link href="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/select2.css" type="text/css" media="all" rel="stylesheet" /> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/admin/js/vendor/jquery/jquery.js"></script> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/admin/js/jquery.init.js"></script> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/jquery.init.js"></script> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/autocomplete.init.js"></script> 
    <script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/autocomplete_light/select2.js"></script> 

Und der Fehler geändert wie folgt aus:

select2.js:66 Uncaught TypeError: $(...).select2 is not a function(anonymous function) @ select2.js:66dispatch @ jquery.js:4435elemData.handle @ jquery.js:4121trigger @ jquery.js:4350(anonymous function) @ jquery.js:4901each @ jquery.js:374each @ jquery.js:139trigger @ jquery.js:4900initialize @ autocomplete.init.js:45each @ jquery.js:374each @ jquery.js:139(anonymous function) @ autocomplete.init.js:50fire @ jquery.js:3099fireWith @ jquery.js:3211ready @ jquery.js:3417completed @ jquery.js:3433 

Schritt 3) und für die letzte, fand ich diese beiden Plugins und hinzugefügt und es funktionierte!

Plugins of [Step 2)] + 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> 

hier sind also meine Fragen:

A) Sollte ich hinzufügen, alle oben genannten Plugins? Zum Beispiel gibt es zwei select2.js auf den Plugins von [Schritt 3]] und ich bin verwirrt und frage mich, ob sie auf unterschiedliche Weise funktionieren. (Wenn ich einen davon entferne, funktioniert es nicht.)

B) Nach der Frage Django autocomplete light: field not populated, sollte Schritt 2 nicht funktionieren? Warum tritt der Fehler auf?

C) Bei diesem Beispielcode scheint der Teil des folgenden Codes überhaupt nicht zu funktionieren. Wenn nicht mit einem Administratorkonto, wird der Fremdschlüssel nicht im Textfeld angezeigt, dh in der Liste kann nichts gefunden werden. (Aus dem dal tutorial, es erlaubt auch ‚autocompletes außerhalb der admin‘)

{% block footer %} 
<script type="text/javascript" src="http://dal-yourlabs.rhcloud.com/static/collected/admin/js/vendor/jquery/jquery.js"></script> 
{{ form.media }} 
{% endblock %} 

@ Ich habe auch django-autocomplete-light not working - select2 is not a function und neu ordnen die installierte App nicht funktioniert hat.

Antwort

0

Die erste select2-Bibliotheksdatei existiert nicht. ausgewählter link raise Host nicht gefunden Fehler

select2 library ist gleich, wenn Sie den ersten Kommentar machen es nicht ausgelöst Fehler. Sie können die Bibliothek in Ihren statischen Ordner herunterladen.

auch jquery Link im letzten Beispiel existiert nicht. Sie können jquery herunterladen und in einen statischen Ordner verschieben.

1

Zuerst müssen Sie Jquery und danach Ihre Drittanbieterbibliothek für das Auswahlfeld einschließen.

  • Select2.min.js (minimierte Version der JS-Datei)
  • Select2.min.css (minimierte Version der CSS-Datei)
  • Dann Import autocomplete.js