PDA

View Full Version : How to add button, textfield and Ext.ux.touch.grid in to Panel



boben
24 Apr 2012, 6:08 PM
I work with Ext.ux.touch.grid, I want to create form including button, textfield,.... and Ext.ux.touch.grid, but all controls are not display, just displayed Ext.ux.touch.grid. Can anyone help me? Many thank.



Ext.define('app.view.mypanel', {
extend: 'Ext.form.Panel',
xtype: 'mypanel',
requires: ['Ext.ux.touch.grid.View',
'Ext.ux.touch.grid.feature.Feature',
'Ext.ux.touch.grid.feature.Sorter'
],
history: [],
config: {
style: 'background: #000;',
layout: 'fit',
items: [
{
id: 'TestToolbar',
title: 'Test Grid',
docked: 'top',
xtype: 'toolbar',
items: [
{
xtype: 'button',
text: 'Back',
ui: 'back',
id: 'settingBackButton'
}
]
},{
xtype: 'panel',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [


{
xtype: 'button',
ui: 'confirm',
text: 'Save',
id: 'saveBtn',

},
{
xtype: 'button',
ui: 'confirm',
text: 'Cancel',
id: 'cancelBtn',

}]
}
,

{
xtype : 'touchgridpanel',
itemId: 'grid',
store : 'MyStore',
features : [
{
ftype : 'Ext.ux.touch.grid.feature.Sorter',
launchFn : 'initialize'
}
],
columns : [
{
header : 'column1',
dataIndex : 'field1',
// style : 'padding-left: 1em;',
cls : 'centered-cell',
width : '50%',
},
{
header : 'column2',
dataIndex : 'field2',
style : 'padding-left: 1em;',
width : '20%',
},
{
header : 'column 3',
dataIndex : 'field3',
style : 'text-align: center;',
width : '20%',
},
]}
],
},
});
}
}

});

mitchellsimoens
26 Apr 2012, 7:35 AM
You are using layout : 'fit' on the form, this will make the first item 100% height and width and not display other items.

soniamru
7 Jun 2012, 5:53 AM
How to add Check box model in sencha touch 2 grid ?? or how can i add select all check box in sencha touch 2 grid ..? please help