PDA

View Full Version : Filling a custom Panel



Mx2014
5 Feb 2014, 4:17 AM
Hey all,

I am new at Ext JS and think that i didn't understand it... I have create a Model (app/model/ModelItem) and a Store (app/store/StoreItems) to access some Data from my Database. To display the stored data I first used a grid. It worked very good. Next I want to create a custom view. Therefor I wanted to create a Ext.Container and loop through all Data in my Store.
I already found a Thread how to go through a store:


myStore.each(function(record)
{
//reading record.get('field name')
}, this);

So first I do not know how to acces my store defined with stroe: "StoreItems" as a variable like myStore?
And second question is: how can I write a custom design? Up to now I usually used php and simple html. But using the Ext JS I didn't know how i can embedd a mix of JS&HTML into a Ext.defin()-clause?
I found the attribute html: "some html", but I think this is the wrong way to create such a custom view?

Can somebody give me a simple example for doing this?
Thank you very much
Mx

skirtle
5 Feb 2014, 4:37 AM
How you access a store depends on the context. Usually you'll have a component (view) and want to get its store, which in most cases is just component.getStore(). However, it seems you've opted to go down the singleton store route so you could just use Ext.getStore('StoreItems') from anywhere, irrespective of context. Personally I tend to use such singletons very rarely as stores don't share nicely (things like sorting and filtering will be applied to all components that share a store).

As for creating bits of custom HTML, you might find this helpful:

http://skirtlesden.com/articles/html-and-extjs-components

Mx2014
6 Feb 2014, 2:30 AM
thank your for the fast reply.
I think thats the one i was looking for. But the given solution didn't work with my code.
Whenn I use a tpl-command in combination with a data-statement it works perfectly. But using a store there will nothing be displayed??


data:{Url:'testpdf'},
tpl:"<object data='{Url}'>..."

works perfectly, but


store: 'myStore',
tpl:"<object data='{Url}'>..."

while the store has a Field named Url will display me nothing?

Whats wrong with this code?
Thank you very much!

skirtle
6 Feb 2014, 2:35 AM
Only certain components bind to a store automatically. If you want automatic binding then DataView is probably your best bet. Otherwise you'll have to do it manually, a bit like your original code snippet.