View Full Version : [MVC] Grid not rendering correctly CSS

19 May 2014, 4:10 AM

I'm using ExtJS with MVC and when I call a grid view is rendering like in the image, with no css, no headers, no style.

View List.js

Ext.define("MyApp.view.List", {
extend: 'Ext.grid.Panel',

xtype: 'tablist',

title: 'All Users',

width: 500,
height: 500,

initComponent: function() {
this.store = {
fields: ['name', 'email'],
data : [
{name: 'Ed', email: '[email protected]'},
{name: 'Tommy', email: '[email protected]'}

this.columns = [
{header: 'Name', dataIndex: 'name', flex: 1},
{header: 'Email', dataIndex: 'email', flex: 1}


View tabpanel:

title: 'Tab',
items: [
{ xtype: 'tablist' }

Thanks! ~o)

19 May 2014, 4:19 AM
(Re)build the app with "sencha app build"

19 May 2014, 4:31 AM
No success,

I'm using ext-all.css and I'm working remote, I do the build local and then I sync with the remote server.


19 May 2014, 4:40 AM
Now works, but I needed to upload the production folder too, the dev folder depends the build folder to work correctly?

19 May 2014, 4:42 AM
Exactly! That is the reason I advised to rebuild.

19 May 2014, 4:47 AM
Thank you!!!

But, just for I understand, why the dev folder depends the build, the build folder is not only the final production?

The sencha app refresh should not be the solution?


19 May 2014, 4:50 AM
No idea why this dependency, I also don't like it but we have to work with what we have.

About refreshing:

If you only change style then "sencha app refresh" followed by "sencha ant sass", sometimes only "sencha ant sass" is enough.

However, if some resources are needed (images, icon) then "sencha app build" is necessary to copy them to the production build.

Practically, I use the lighter approach first and if it doesn't work then I rebuild.

19 May 2014, 5:13 AM
It's kind of strange re-build the app, but if is necessary..

Thank you !