PDA

View Full Version : Total Sencha Touch Newbie? Panel not rendering ...



davisty
7 Sep 2011, 11:08 AM
Hello,

Im new to touch and 4.0. Im doing a crash course by necessity.

I have a list that Im trying to render in chrome, but it's not rendering. Im using the example out Kichen Sink for a list.

My list will not render, Im getting no rendering, and firebug isnt reporting any erros. I know Firefox wont work, Im just using firefox for syntax errors. And the jsonstore is being loaded. Does anyone see anything?



Ext.regModel('VESVOY', {
fields: ['SCVESL', 'SCVOYN']
});
// create the data store
var ListStore = new Ext.data.JsonStore({
model: 'VESVOY',
proxy: {
type: 'ajax',
url: 'EXTJSVV.PGM',
reader: {
type:'json',
root:'MDVESB'
}
},
sorters: 'SCVESL',
getGroupString : function(record) {
return record.get('SCVESL')[0];
},
autoLoad: true,
root: 'MDVESB',
fields: [
'SCVESL',
'SCVOYN',
]
});

List = new Ext.Panel ({
items: [{
title: 'Grouped',
layout: Ext.is.Phone ? 'fit' : {
type: 'vbox',
align: 'center',
pack: 'center'
},
cls: 'demo-list',
items: [{
width: Ext.is.Phone ? undefined : 300,
height: 500,
xtype: 'list',
store: ListStore,
itemTpl: '<div class="contact"><strong>{SCVESL}</strong>{SCVOYG}</div>',
grouped: true,
indexBar: true
}]
}]
});

arthurakay
7 Sep 2011, 11:53 AM
You don't tell your panel ("List") to render anywhere!

You could use the "renderTo" config, or you could set the "fullscreen" config to true.

davisty
7 Sep 2011, 11:59 AM
I saw that after I posted and added it. But Im getting the same results.

Im not getting any js errors and the liststore is loading ...

Im not sure but do I need the doc ready ?





<!doctype html> <html> <head> <title>Sencha Touch Example</title> <link rel="stylesheet" type="text/css" href="/JS/sencha-touch.css (http://www.sencha.com/forum/view-source:http://server1.vilden.net:9289/JS/sencha-touch.css)" /> <script type="text/javascript" src="/JS/sencha-touch-debug.js (http://www.sencha.com/forum/view-source:http://server1.vilden.net:9289/JS/sencha-touch-debug.js)"></script> <script type="text/javascript"> Ext.regModel('VESVOY', { fields: ['SCVESL', 'SCVOYN'] }); // create the data store var ListStore = new Ext.data.JsonStore({ model: 'VESVOY', proxy: { type: 'ajax', url: 'EXTJSVV.PGM', reader: { type:'json', root:'MDVESB' } }, sorters: 'SCVESL', getGroupString : function(record) { return record.get('SCVESL')[0]; }, autoLoad: true }); List = new Ext.TabPanel ({ fullscreen: true, showAnimation: { type: 'pop', duration: 250 }, renderTo: 'panel', items: [{ title: 'Grouped', layout: Ext.is.Phone ? 'fit' : { type: 'vbox', align: 'center', pack: 'center' }, cls: 'demo-list', items: [{ width: Ext.is.Phone ? undefined : 300, height: 500, xtype: 'list', store: ListStore, itemTpl: '<div class="contact"><strong>{SCVESL}</strong>{SCVOYG}</div>', grouped: true, indexBar: true }] }] }); </script> </head> <body>
<div id="panel"></div> </body> </html>

arthurakay
7 Sep 2011, 12:10 PM
BTW, be careful when copy/pasting your code into the CODE tags... your line breaks are not being respected and it's painful to look through.

The Ext.onReady() may help... it's good practice to use anyways. Give it a shot and let me know.

davisty
7 Sep 2011, 12:16 PM
That did it !!!

I wasnt sure about it in touch or sencha ...

Im buying you a beer tonight ...:))

Oh, BTW how do I post it with the line break?

arthurakay
7 Sep 2011, 12:26 PM
When you copy/paste your code, you may have to manually re-enter the line breaks. Just look at your post after you submit it, and if the line breaks are messed up just hit "edit post" and reenter the line breaks.

Glad you got it working!

steve1964
7 Sep 2011, 2:10 PM
Was just answered, sorry....

davisty
8 Sep 2011, 4:53 AM
What is Ext.Setup?

Im making my first dive into touch and 4.0. Ive got some experience with the 3.x family but thats about it.

Im having problems finding meaningful 4.0/touch examples. Im taking the existing examples and ...trying... to extrapolate them into our environment. We use the System i(AS/400) so I not too knowledgeable with PHP(although it runs on "i"). We use RPG to make the ajax response.

Not a criticism, but there needs to be more business related type examples(doing DB fetches and stuff), in addition to the facebook/social-media stuff.