PDA

View Full Version : Symfony2 + Extjs4 css path problem



Murielle666
16 Apr 2013, 12:52 AM
I have installed the Extjs 4.1 into my Symfony2 project and my Symfony web folder now looks like this



web/
bundles/
mybundle/
js/
extjs/
src/
resources/
...



I use the Extjs in my Symfony views folder
To make the Extjs work I added the following code to my view to be able to use the Extjs components


{% stylesheets '@CtaCommonBundle/Resources/public/js/extjs/resources/css/ext-all.css' %}
<link href="{{ asset_url }}" type="text/css" rel="stylesheet" />
{% endstylesheets %}

{% javascripts '@CtaCommonBundle/Resources/public/js/extjs/ext-debug.js'%}
<script src="{{ asset_url }}"></script>
<script>
Ext.Loader.setPath('Ext', '/bundles/ctacommon/js/extjs/src');
</script>
{% endjavascripts %}

My problem is that the css is going to the wrong path.
When I render a Combobox it's searching it's theme images in the following url.

my.website.com/app_dev.php/resources/themes/images/default/form/trigger.gif
While it should be going to this one

my.website.com/app_dev.php/bundles/mybundle/js/extjs/resources/themes/images/default/form/trigger.gif

At the moment I've solved it by moving my entire resource folder directly into my web folder, but I don't think that is the right way to do it.

slemmon
17 Apr 2013, 2:13 PM
I'll start by saying that I don't know anything about Symfony.
But, regarding the CSS do you see it loads on page load? If you look in the sources panel of Chrome Dev Tools for instance?

Murielle666
17 Apr 2013, 10:35 PM
The css is loaded perfectly, but the url in the css is going to the wrong folder.


.x-form-trigger {
background-image: url("../../resources/themes/images/default/form/trigger.gif");

background-position: 0 0;
border-bottom: 1px solid #B5B8C8;
cursor: pointer;

height: 21px;
overflow: hidden;
width: 17px;


}




The ../../ is referring to the web/ folder while it should go to web/bundles/mybundle/js/extjs/
The easy fix for me was to put the resources folder directly into my web/ folder. It was either that or change the urls in my css.

I'm just trying to find out what the best practice is.

slemmon
18 Apr 2013, 2:05 PM
I would think what you did is right. The image resources should be positioned on the file system relative to the CSS such that the rules can find them.

Murielle666
18 Apr 2013, 10:02 PM
Ok thanks.