PDA

View Full Version : Loading data into a component without a Store



dannykopping
24 Nov 2011, 2:45 PM
Hi all!

I'm a Flex refugee and I'm slowly making my way through ExtJS.
I'm porting over an ActionScript 3.0 library for doing web-services to an open-source backend I've written, and I want to find out if there's any way to load data into an ExtJS component without a Store? Is this a really stupid question because I don't understand ExtJS yet?

I'd appreciate any and all help!

tobiu
24 Nov 2011, 2:55 PM
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.ComponentLoader

dannykopping
24 Nov 2011, 2:59 PM
Hi tobiu

That's not quite what I'm looking for; I have the data I want to load into the component already and so I don't need the component to handle its own data retrieval. Is there some event that gets responded to by the Component which causes it to query the associated Store for its data? Perhaps I could fire that event and "fool" the component into thinking that the data is coming from the Store (i hope this makes sense)

Thanks

tobiu
24 Nov 2011, 3:12 PM
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Component


update( String/Object htmlOrData, [Boolean loadScripts], [Function callback] )
Update the content area of a component.

Parameters
htmlOrData : String/Object
If this component has been configured with a template via the tpl config then it will use this argument as data to populate the template. If this component was not configured with a template, the components content area will be updated via Ext.Element update
loadScripts : Boolean (optional)
Only legitimate when using the html configuration.

Defaults to: false
callback : Function (optional)
Only legitimate when using the html configuration. Callback to execute when scripts have finished loading

dannykopping
24 Nov 2011, 3:25 PM
Thanks tobiu! That's getting me a little closer, but it's rendering the data as a string of "[object Object]" - not the way the data is rendered when a used with a Store - is there no way to just hook into the process that the Store uses to pass data to the component?

Thanks for the help!

tobiu
24 Nov 2011, 3:30 PM
it depends like the comment said. if you have an XTemplate specified for the component, it is basically the same as a store that is bound to a view (which has an XTemplate as well).

dannykopping
24 Nov 2011, 3:48 PM
Interesting!

Ok, I'm not very familiar with XTemplates just yet - but I'm trying to load data into a Panel (which I assume would have a default XTemplate applied to it) and it's not working as expected. Do I have to explicitly apply an XTemplate or can I use the default template of the Panel? I tried getting the "tpl" property of the element I'm working with, but it seems to be "undefined".

dannykopping
27 Nov 2011, 1:29 PM
I've found a potential hook in the AbstractView class - there is an "onDataChanged" function which is the callback for the "datachanged" event. This event is fired when data is changed in a Store, and the AbstractView listens for this and accesses the Store's data to render it.

Is this the right direction to be going in?

dannykopping
27 Nov 2011, 2:03 PM
OK - I think I've solved the problem.

I've got a callback on an AJAX request which runs the following code:


success: function(response){
var list = Ext.getCmp("userlist1");


var store = Ext.getStore("Users");
list.bindStore(store);


store.loadData(response);
}

I've got a component called userlist1 which I manually bind a Store to using the bindStore function, and then load the response data (which is an array of User model instances) into the Store. This example is using a predefined Store definition, but it's trivial to create a temporary Store on the fly (I'd imagine) and then bind that to a View.