2013-07-17 2 views
1

현재 TWIG에서 JQuery를 사용하려고합니다. 내 웹 사이트는 Symfony2를 사용하여 만들어졌습니다. 나는 현재 TWIG에 테이블을 가지고있다. (그것은 작동한다. 아래를 보라). 테이블 컬럼을 정렬 할 수 있도록 JQuery를 사용하고 싶다.TWIG에서 JQuery를 사용하는 방법 (symfony2)

<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 %} 

내 테이블에서 내 원하는 기능을 얻기 위해 (here 참조) DataTables을 활용하고 싶습니다. TWIG에서 DataTable을 사용할 수 있도록 생성 된 번들 (here 참조)이 있습니다. 번들이 성공적으로 설치되었습니다 (web/bundles/uamdatatables /).

번들에 사용 지침이 없으므로 불편 함을 유발하는 이유는 번들이 (내 테이블에 DataTables에서 제공하는 기능을 갖도록) 만들려고했지만 아직 테이블이 변경되지 않았기 때문입니다 (오류 메시지가 표시되지 않음). 어느 한 쪽).

누군가 내가 잘못하고있는 것을 말할 수 있는지 궁금하십니까? 필자는 전에 JQuery를 사용한 적이 없으며 Symfony를 처음 사용합니다. js 파일에 접근하기 위해 "include"문이 필요합니까?

//view.html.twig

<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> 

감사합니다! Tanya

+0

[jQuery를 포함하는 다양한 방법에 대한 답변] (http://stackoverflow.com/a/41324944/194131)을 읽어 보시기 바랍니다. 6). – Kwadz

답변

4

예, 자바 스크립트 블록에 jQuery 파일을 포함시켜야합니다. 예 : 이미이없는 경우

것은 jQuery를 당신에게 파일 :

{% block javascripts %} 
    <script type="text/javascript" src="{{ asset('bundles/uamdatatables/js/jquery.min.js') }}"></script> 
{% endblock %} 

테이크 케어 상속 자바 스크립트를 덮어 쓰지 않도록, 어쩌면 당신은 {% block javascripts %}

편집에 {{ parent() }}를 추가해야 http://jquery.com/

+0

jquery를 포함하도록 스크립트를 변경했습니다. {% block javascript %} '을 {% block javascripts %}에서 **로 바꾸지 말고 그냥 그 행을 추가하십시오. ** 2 - ** 실제로 그 자산 위치에'jquery.min.js' 파일이 있습니까? 그렇지 않으면 다른 곳에서'jQuery' 파일을 다운로드하여 넣거나'자산 경로'의 이름을 바꿀 수 있습니다 –

+0

다음 코드 (아래)가 작동하지 않을 수 있습니다 (따라서 JQuery는 사용되지 않습니다.); ?> –

관련 문제