PDA

View Full Version : Sencha Touch 2 Grid



NCN
13 Apr 2012, 4:40 AM
Do we have the Gride in Sencha touch.

I downloaded the versatile grid from :-
http://market.sencha.com/addon/ext.ux.touch.grid

B (http://market.sencha.com/addon/ext.ux.touch.grid)ut it is not working fine in my system.
Can some one help me out to create the Gride in sencha Touch 2.

Thanks in advance !!!

mitchellsimoens
13 Apr 2012, 5:43 AM
The GitHub repo is at https://github.com/mitchellsimoens/Ext.ux.touch.grid and is updated more frequently.

There are also a few examples provided.

NCN
16 Apr 2012, 1:14 AM
Thanks..it is working fine.

I have one query , can we import or Copy paste data to the excel from the grid .??

what would be the code for the Customization this ??

bigb13
28 Jun 2012, 12:00 PM
Are there any plans to add the ability to freeze a column, similar to the column "locked: true" in Ext JS.

mitchellsimoens
28 Jun 2012, 12:05 PM
Are there any plans to add the ability to freeze a column, similar to the column "locked: true" in Ext JS.

There is a plan

marco1991
28 Jan 2013, 4:04 AM
hi all,
in the Github folder i can't find a working example.. is normal?
i downloaded all the folder and if i run the index.html doesn't work……… :((

there is a solution?
can you give me a working example? thanks!

mitchellsimoens
28 Jan 2013, 5:39 AM
Did you change the path to Sencha Touch in the HTML files?

marco1991
28 Jan 2013, 5:56 AM
but i'm using the same folder so the paths are the same..aren't they?

this is the index.html


<!DOCTYPE HTML><html manifest="" lang="en-US">
<head>
<meta charset="UTF-8">
<title>Grid</title>
<style type="text/css">
/**
* Example of an initial loading indicator.
* It is recommended to keep this as minimal as possible to provide instant feedback
* while other resources are still being loaded for the first time
*/
html, body {
height: 100%;
background-color: #1985D0
}


#appLoadingIndicator {
position: absolute;
top: 50%;
margin-top: -15px;
text-align: center;
width: 100%;
height: 30px;
-webkit-animation-name: appLoadingIndicator;
-webkit-animation-duration: 0.5s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: linear;
}


#appLoadingIndicator > * {
background-color: #FFFFFF;
display: inline-block;
height: 30px;
-webkit-border-radius: 15px;
margin: 0 5px;
width: 30px;
opacity: 0.8;
}


@-webkit-keyframes appLoadingIndicator{
0% {
opacity: 0.8
}
50% {
opacity: 0
}
100% {
opacity: 0.8
}
}
</style>
<!-- The line below must be kept intact for Sencha Command to build your application -->
<script id="microloader" type="text/javascript" src="sdk/microloader/development.js"></script>
</head>
<body>
<div id="appLoadingIndicator">
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>

there aren't external path

mitchellsimoens
28 Jan 2013, 5:59 AM
Thought you were talking about the index.html in the root dir

marco1991
28 Jan 2013, 6:03 AM
the example in not in the mvc folder?

anyway now it works :D
but what files are necessary for the grid? all the file in the folder?

marco1991
16 Feb 2013, 4:41 AM
hi,

i'm using this grid.. is pretty good but how can I put a spinner (xtype: spinnerfield) in a cell?

thanks!

raskri
12 Mar 2013, 1:07 PM
This UX works perfectly! Thanks!

What is the preferred way to include these files in my app?~o)

In app.js I have:

Ext.Loader.setPath({
'Ext': '../touch/src',
'MyApp': 'app',
'Ext.ux.touch.grid': 'ux/Ext.ux.touch.grid'
});

// in one of my panels i require the List
...
requires: ['Ext.ux.touch.grid.List'],
...



This works fine when I run in "dev" mode. But when I compile with Sencah Cmd(sencha app build production), I get Errors.

App structure:


/
app.js
app/
ux/Ext.ux.touch.grid/List


Getting the error:

com.sencha.exceptions.ExBuild: Failed to find any files for Ext.ux.touch.grid.List (x-app-build#273) runAppBuild (x-app-build:273) [anonymous] (x-app-build:545) x_app_build (x-app-build:543) <script> (anonymous:1)

Any pointers are appreciated! :)

amackay11
18 May 2013, 11:34 AM
Raski,

Not sure what your issue is. I have

Ext.Loader.setPath({
'Ext': 'touch/src',
'myapp': 'app'
, 'Ext.ux.touch.grid': 'ux'
, 'Ext.ux': 'ux'
});
.....
requires: [

'Ext.ux.touch.grid.feature.Feature',
'Ext.ux.touch.grid.feature.Editable',
....



and files directly in app/ux.

tpapout
5 Jun 2013, 5:34 AM
Dear mitchellsimoens,
I have already spend 1 full day to use your grid (which seems wonderful) in architect, without success.
I know that it is no more than 5 minutes to you, to provide a full working example for this grid in architect.
Please do it.
Thank you in advance

stogsdid
1 Jul 2013, 7:50 AM
Hi, I am able to get the grid to display fully when the grid is displayed from a tab but I am having an issue (using the same code) getting the grid to fully display when the grid is displayed using
list.up('navigationview').push(showChart).. Only the Grid column headings are displayed. I have traced through the code and the store is loaded with data.


showChart = Ext.create('MobileAccess.view.dashboard.finance.AROvr120GridContainer');

Grid Container:

Ext.define('MobileAccess.view.dashboard.finance.AROvr120GridContainer', { extend: 'Ext.Panel',
xtype: 'AROvr120gridcontainer',
requires : [
'MobileAccess.view.dashboard.finance.AROvr120'
],
config: {


title: 'Highest A/R Over 120',
items:
[
{
xtype: 'fieldset',
docked: 'top',
style:
{
background: 'none'
},
defaults:
{
//iconMask: true
},
items:
[
{
xtype: 'selectfield',
name : 'OARlocation',
id: 'OARchartlocation',
label: 'Location',
placeHolder : 'Select',
valueField: 'WK_CDB',
displayField: 'WK_FULL'
},
]
},
{
xtype: 'container',
id: 'totalARchartNodata',
hidden: true,
html: '<div class="NoChartMsg">&nbsp; The selected location does not have any A/R Over 120 Data to display. </div>'
},
{
xtype: 'ARovr120'
}
]
}
});

Grid ARovr120:

Ext.define('MobileAccess.view.dashboard.finance.AROvr120', { extend : 'Ext.ux.touch.grid.List',
xtype : 'ARovr120',
id: 'ARovr120',


requires : [
'Ext.ux.touch.grid.feature.Feature',
'Ext.ux.touch.grid.feature.Sorter',
'Ext.field.Number',
'MobileAccess.store.Grid',
'MobileAccess.store.AROvr120s'
],


config : {
//title : 'Highest A/R Over 120',
//store : true,
store :
{
fileds:
[ 'custname', 'amtovr120', 'totamt'],
data :
[
{ custname : 'Jim Prout', amtovr120 : '1,916,296,550', totamt: '2,170,550,505' },
{ custname : 'Douglas Prout', amtovr120 : ' 251,585,952', totamt: ' 256,612,392' },
{ custname : 'Gianville Excaating', amtovr120 : ' 3,482,204', totamt: ' 3,613,607' },
{ custname : 'Gerald Prout', amtovr120 : ' 424,113', totamt: ' 440,685' },
{ custname : 'Srah Smiles', amtovr120 : ' 341,896', totamt: ' 353,880' },
{ custname : 'Bolton Farms', amtovr120 : ' 125,290', totamt: ' 130,302' },
{ custname : 'Wes Johnstone', amtovr120 : ' 101,649', totamt: ' 105,715' },
{ custname : 'Jason', amtovr120 : ' 94,490', totamt: ' 97,926' },
{ custname : 'Chator Services', amtovr120 : ' 72,133', totamt: ' 74,210' },
{ custname : 'John Ferguson', amtovr120 : ' 60,731', totamt: ' 62,676' },
]
},


columns : [
{
header : 'Customer Name',
dataIndex : 'custname',
width : '40%'


},
{
header : 'Over 120',
dataIndex : 'amtovr120',
width : '20%'
},
{
header : 'Total',
dataIndex : 'totamt',
width : '20%'
}
],
features : [
{
ftype : 'Ext.ux.touch.grid.feature.Sorter',
launchFn : 'initialize'
}
]
}


//applyStore : function() {
//return new MobileAccess.store.Grid();
// return new MobileAccess.store.AROvr120s;
// }
});

Any guidance / thoughts are greatly appreciated :)

huseyinsarioglu
27 Sep 2013, 12:58 AM
Dear mitchellsimoens,
I have already spend 1 full day to use your grid (which seems wonderful) in architect, without success.
I know that it is no more than 5 minutes to you, to provide a full working example for this grid in architect.
Please do it.
Thank you in advance

Hi mitchell (http://www.sencha.com/forum/member.php?22216-mitchellsimoens),
I need too an example for architect. Please help.
Thanks.

csextjs
27 Jul 2015, 7:47 AM
Hi Mitchell,

Great product. Does this work with ST 2.4.x?

mitchellsimoens
27 Jul 2015, 7:50 AM
I haven't worked on my grid for a long time and haven't used it with 2.4.x. I am not going to work on it any more since Sencha Touch 2 and Ext JS 6's modern toolkit have a grid component.

cygnosis
25 Aug 2016, 5:33 PM
Last working with ST 2.2, not working anymore on latest ST 2.4.
I hope somebody picked up this project and make it work. :(

Is there any alternative working grid that is opensource?