2014-07-21 2 views
1

jQuery 플러그인 imgAreaSelect (website)를 사용하여 Symfony2에서 새로운 양식 유형으로 이미지 자르기를 만듭니다. 내 양식 유형 템플릿 (imagecropper_widget.html.twig)에서 jQuery 및 플러그인 라이브러리를로드합니다.Symfony2 양식 서식 파일에서 javascript flles 추가

jQuery가 내 base.html.twig에도로드되어 있으므로 플러그인 라이브러리의 함수가 더 이상 작동하지 않습니다. Firebug는 "함수가 아닙니다"라는 오류를 발생시킵니다. 내 base.html.twig에서 jQuery를 제거하면 잘 작동하지만 솔루션이 아닙니다.

내가 자바 스크립트 블록에 필요한 순간에 필요한 자바 스크립트 파일을 추가하는 방법이 있다면 좋을 것입니다. 내 테마에서 javascripts 블록을 덮어 쓰려고했지만 Symfony는 다른 템플릿을 사용하거나 확장하지 않기 때문에 오류가 발생합니다.

그렇다면 javascript 파일을 base.html.twig 페이지에있는 블록에 추가 할 수있는 합법적 인 방법이 있습니까? base.html.twig에서

자바 스크립트 블록 :

{% block javascripts %} 
    {% javascripts '@jquery_js' '@bootstrap_js' filter='?yui_js' combine=true %} 
     <script src="{{ asset_url }}"></script> 
    {% endjavascripts %} 
{% endblock %} 

imagecropper_widget.html.twig

{% block imagecropper_widget %} 
    {% spaceless %} 
    <h2>Select the area</h2> 
    <img src="http://localhost/project/web/test.jpg" id="imgc" style="width:100%" /> 

    {% block javascripts %} 
     {% javascripts 
     '@jquery_js' 
     'bundles/imanagecmsfield/js/jquery.imgareaselect.js' 
     'bundles/imanagecmsfield/js/process.js' 
     filter="?yui_js" 
     %} 
     <script src="{{ asset_url }}"></script> 
     {% endjavascripts %} 

    {% endblock %} 

    {% endspaceless %} 
{% endblock %} 

여러분의 도움에 감사드립니다!

답변

0

저는 보통 기본 템플릿에 스크립트와 CSS 파일 을 넣지 않고 자바 스크립트 블록 안에 넣습니다. Javascript 블록은 일반적으로 비어 있으며 기본 템플릿의 맨 아래에 있습니다.

base.html.twig : 내가 추가하는 경우

{% javascripts 'XXX' %} 
<script type="text/javascript" src="{{ asset_url }}"></script> 
{% endjavascripts %} 

{% block javascripts %}{% endblock %} 

이 방법은, 아무것도 무시되지 않습니다 특정 사이트 스크립트

otherside.html.twig :

{% block javascripts %} 
    {% javascripts %} 
    <script type="text/javascript" src="{{ asset_url }}"></script> 
    {% endjavascripts %} 
    <script type="text/javascript"> 
     ; 
    </script> 
{% endblock %} 
+0

이 경우'{% extends ':: base.html.twig'%}'또는'{% use ':: base.html.twig'%}'를 사용합니까? 'use'를 사용하면 Symfony가 템플릿 Template :: :: base.html.twig를 특성으로 사용할 수 없습니다. – Stefan

+0

{% extends ':: base.html.twig'%}를 사용합니다. 기본 템플릿에서 상속받을 때 "사용"이 의미가 있는지 확실하지 않습니다. 그러나 나는이 시나리오를 본 적이 없다. – christoph

+0

확장 기능은보기에 효과적입니다. 이 경우 템플리트는 양식 유형 용입니다. 심지어 위젯 블록을 찾기 때문에 템플릿 파일에서 해당 블록을 사용할 수 없습니다. 나는 최고의 솔루션에서 멀리 떨어져있는 뷰 템플릿을 통해 자바 스크립트를 주입하는 것에 다시 실패해야만한다. – Stefan

0

당신이 만약 여러 스크립트 태그가 필요 없으므로 (모든 애셋 결합이 손실 됨) javascript 블록을 덮어 쓰고 부모를 다음과 같이 겹쳐 쓸 수 있습니다.

{% block javascripts %} 
{{ parent() }} 
{% javascripts 
    '@AcmeDemoBundle/Resources/public/js/*.js' 
%} 
<script src="{{ asset_url }}"></script> 
{% endjavascripts %} 
{% endblock %} 

그렇지 않으면 실제로 구성 할 수 있도록 여기에 설명 된대로 더 많은 작업을 수행해야합니다. https://symfonybricks.com/en/brick/smart-use-of-assetic-to-compress-javascripts-and-stylesheets

실제로 구성 배열에 자바 스크립트를 추가하는 이벤트 수신기와 함께 사용하면 다음과 같이 구성 가능한 솔루션을 제공해야합니다 .-).

+0

부모 함수는 폼 유형에 대해 작동하지 않습니다. 작동하는 예가 있습니까? – Stefan