PDA

View Full Version : The grid in my window isnt rendering correctly



brandonc
30 Mar 2011, 11:44 AM
I have an Ext.Window with a GridPanel as them item, but it isn't rendering correctly. It look like there are images missing, but I couldn't find any.

Here's what it looks like (also, it looks like this cross browser so its not just an IE bug or anything).

http://i51.tinypic.com/25am9h4.png

Here is the code I'm using.



showEventCategoryEditWindow : function() {
var toolbar = new Ext.Toolbar({
items: [{
xtype: 'button',
text: 'Add',
icon: '/img/icons/add.png'
}, {
xtype: 'button',
text: 'Remove',
icon: '/img/icons/delete.png'
}]
});

var gridView = new Ext.grid.GridView({
forceFit: true
});

var colModel = new Ext.grid.ColumnModel([
{ header: 'id', width: 50, dataIndex: 'id' },
{ header: 'Name', width: 180, sortable: true, dataIndex: 'title' },
{ xtype: 'datecolumn', format: 'm/d/Y h:i A', header: 'Created', width: 150, sortable: true, dataIndex: 'created' },
{ xtype: 'datecolumn', format: 'm/d/Y h:i A', header: 'Modified', width: 150, sortable: true, dataIndex: 'modified'}
]);

var selModel = new Ext.grid.RowSelectionModel({
singleSelect : true
});

var grid = new Ext.grid.GridPanel({
tbar: toolbar,
store: this.calendarStore,
border: true,
cm: colModel,
sm: selModel,
view: gridView,
height: 387
});

if (!this.categoryEditWin) {
this.categoryEditWin = new Ext.Window({
closeAction: 'hide',
title: 'Edit Event Categories',
modal: true,
height: 400,
width: 600,
shim: false,
animCollapse: false,
constrainHeader: true,
layout: 'fit',
items: [{
xtype: 'grid',
tbar: toolbar,
store: this.calendarStore,
border: false,
cm: colModel,
sm: selModel,
view: gridView,
height: 387
}]
});
}

this.categoryEditWin.show();
}