Wie JQuery in TWIG (symfony2)
Ich bin versucht derzeit, die Nutzung von JQuery in TWIG. Meine website wurde erstellt mit Symfony2. Ich habe derzeit eine Tabelle in TWIG (es funktioniert - siehe unten), für die ich gerne machen Verwendung von JQuery, um meine Tabellen-Spalten sortierbar.
<table><tr><th>cat</th> <th>dog</th> <th>fish</th> </tr> {% for result in results %}<tr><td>{{result.cat_name}}</td><td>{% for dog in result.dogs %} {{dog.dog_name}}{% endfor %} </td> <td>{% if result.fishs is defined %} {% for fish in result.fishs %}
{{fish.fish_uri}}
{% endfor %} {% endif %} </td></tr>{% endfor %}
Möchte ich die Verwendung von Datentabellen (siehe hier), um meine gewünschte Funktionalität von meinem Tisch. Es ist ein Bündel (siehe hier), die wurde geschaffen, um ermöglichen den Einsatz von DataTables in TWIG. Das bundle wurde erfolgreich installiert (web/bundles/uamdatatables/).
Was mich veranlasst, Unsicherheit (als bundle nicht haben, verwenden Sie die Anweisungen), ist, dass ich versucht habe, das bundle Arbeit (um meine Tabelle haben, die die Funktionen von DataTables), und noch meine Tabelle bleibt unverändert (keine Fehlermeldungen, entweder).
Fragen, ob jemand mir sagen könnte was ich falsch mache? Ich habe noch nie verwendet JQuery vor, und bin neu in Symfony. Brauche ich eine Art "include" - Anweisung (man js-Dateien)?
//view.html-Code.Zweig
<table><table id="table_id" class="display"><thead> {% block stylesheets %}
<link href="{{ asset('/bundles/uamdatatables/css/jquery.dataTables.css') }}" rel="stylesheet" />
<script type="text/javascript" charset="utf-8" src="/bundles/uamdatatables/css/jquery.dataTables.css"></script>
{% endblock %}<tr><th>cat</th> <th>dog</th> <th>fishs</th> </tr></thead> <tbody><?php $(document).ready( function () {
$('#table_id').dataTable();} );?>{% block javascripts %}
<script src="{{ asset('/bundles/uamdatatables/js/jquery.dataTables.js') }}"></script>
{% endblock %}{% for result in results %}<tr><td>{{ result.cat_name}}</td><td>{% for dog in result.dogs %}{{dog.dog_name}}{% endfor %}</td><td>{% if result.fishs is defined %} {% for fish in result.fishs %}{{fish.fish_uri}}{% endfor %}{% endif %}</td></tr>{% endfor %}</tbody> </table>
Danke!
Tanya
- Ich schlage vor, Sie zu Lesen diese Antwort über die verschiedenen Möglichkeiten zur Einbindung von jQuery.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Ja, in deinem block des javascripts müssen Sie die jQuery-Datei. Ein Beispiel:
Achten Sie darauf, nicht zu überschreiben geerbte javascripts, haben Sie vielleicht hinzufügen
{{ parent() }}
zu den{% block javascripts %}
EDIT:
Wenn Sie nicht bereits über ein jQuery-Datei, die Sie herunterladen können es von der offiziellen website: http://jquery.com/
{{ parent() }}
. Der Punkt ist, in der Tat, zwei Punkte: 1- Sie müssen<script type="text/javascript" src="{{ asset('bundles/uamdatatables/js/jquery.min.js') }}"></script>
im {% block javascripts %}, nicht ersetzt, fügen Sie einfach diese Zeile. 2- haben Sie wirklich diejquery.min.js
- Datei in das asset-Speicherort? Wenn Sie nicht, können Sie herunterladen und legen Sie es dort oder, wenn Sie diejQuery
Datei in einem anderen Speicherort, yo können es verschieben oder umbenennen derasset path
sortable effect
?