PDA

View Full Version : unable to view grid inside the form panel



sachin sachdeva
28 Apr 2011, 3:48 AM
Hi I am trying to view a grid inside the form my code is....



Ext.setup({
icon: 'icon.png',
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
glossOnIcon: false,
onReady: function() {

var form;

Ext.regModel('User', {
fields: [
{name: 'name', type: 'string'},
{name: 'password', type: 'password'},

]
});

Ext.regModel('Ranks', {
fields: [
{name: 'rank', type: 'string'},
{name: 'title', type: 'string'}
]
});

var ranksStore = new Ext.data.JsonStore({
data : [
{ rank : 'master', title : 'Master'},
{ rank : 'padawan', title : 'Student'},
{ rank : 'teacher', title : 'Instructor'},
{ rank : 'aid', title : 'Assistant'}
],
model : 'Ranks',
autoLoad : true,
autoDestroy : true
});

var formBase = {
scroll: 'vertical',
layout : 'fit'

standardSubmit : true,
items: [grid],


dockedItems: [
{
xtype: 'toolbar',
dock: 'bottom',
items: [

{xtype: 'spacer'},

{
text: 'OK',
ui: 'confirm',
handler: function() {

}
}
]
}
]
};

if (Ext.is.Phone) {
formBase.fullscreen = true;
} else {
Ext.apply(formBase, {
autoRender: true,
floating: true,
modal: true,
centered: true,
hideOnMaskTap: false,
height: 385,
width: 480
});
}

form = new Ext.form.FormPanel(formBase);
form.show();
}
sm = new Ext.grid.CheckboxSelectionModel({
singleSelect : false,
checkOnly : true

});
var columnModel = new Ext.grid.ColumnModel([
sm,
{
header : "Author"



}
]
);
grid = new Ext.grid.GridPanel({
id : 'document-grid',
height : 422,

autoWidth : true,

cm : columnModel,
sm : sm,
deferredRender : true,
ddGroup : 'GridDD'


});
grid.render();

});



According to me this should work fine but i am neither able to see the form not the grid please let me know where i am mistaken.