PDA

View Full Version : Not sure how to reload a store



Krishopper
24 Nov 2010, 7:29 AM
Hello,

I have an application that has a navigation menu on the left and a content pane on the right. When a menu option is clicked on, the display is rendered on the right. For one of my menu options (titled "List Domains"), I have the following listener:


listeners: {
click : function(n) {
var content = Ext.getCmp('content-panel');
content.setTitle("Domains");
content.removeAll();
var container = content.add(new Application.DomainGrid());
content.doLayout();
container.show();
}
}


I also have an "Add Domain" menu option menu option (and a tab panel button above the grid) that introduces a pop-up window with a form, submits a JSON request to the server, and closes upon success.


listeners: {
click : function(n) {
var win = new Ext.Window({
id: 'domain-add-form-win',
title: 'Add Domain',
layout: 'fit',
width: 350,
height: 125,
closable: true,
border: true,
items: { id: 'domainaddform-form', xtype: 'domainaddform' }
});
win.show();
}
}

I have the form's onSuccess listener closing the form window upon success, but I would also like it to re-load the data in the grid if the grid is open. I made an attempt, but using Firebug to debug it reports the following error "Ext.getCmp("domain-grid-panel") is undefined".

This is the attempt that I made - the line of code that I'm unsure of how to implement is commented out.


,onSuccess:function(form,action) {
Ext.Msg.show({
title: 'Success'
,msg: 'Domain created successfully'
,modal: true
,icon:Ext.Msg.INFO
,buttons: Ext.Msg.OK
});
// Ext.getCmp('domain-grid-panel').getStore().reload();
Ext.getCmp('domain-add-form-win').hide();
}

The GridPanel is defined as follows (first few lines ...)


Application.DomainGrid = Ext.extend(Ext.grid.GridPanel, {
border: false,
initComponent:function() {
var config = {
id: 'domain-grid-panel',
store: new Ext.data.Store({[...]


Could someone point out to me what I may be missing? Maybe I do not understand how the 'id' is set when extending an existing class?

Please forgive me if the way I am doing things is not correct. If you see that I am doing something completely wrong, I would appreciate any feedback. I'm very new to Extjs and this is my first attempt at an application.

mschwartz
24 Nov 2010, 8:00 AM
You're pretty much doing it right.

The id of a component is usually (should be!) set by the caller/creator of the component. As in:



var cmp = new WhateverComponent({ id: uniqueId ... });

or

{
xtype: 'whatevercomponent',
id: uniqueId
}


to reload the grid, something like this works:



var grid = Ext.getCmp(idOfGrid);
grid.store.reload();

winklerd
24 Nov 2010, 8:13 AM
In the event that the grid hasn't been created/rendered yet, you might want to add an if statement to mschwartz's suggestion:


var grid = Ext.getCmp(idOfGrid);
if(grid) grid.store.reload();

mschwartz
24 Nov 2010, 8:23 AM
In the event that the grid hasn't been created/rendered yet, you might want to add an if statement to mschwartz's suggestion:


var grid = Ext.getCmp(idOfGrid);
if(grid) grid.store.reload();

(var grid = Ext.getCmp(idOfGrid)) && grid.store.reload();

Krishopper
24 Nov 2010, 8:26 AM
You're pretty much doing it right.

The id of a component is usually (should be!) set by the caller/creator of the component. As in:


Perfect! That helped. I was unaware that it should be est by the creator of the component. I have made those adjustments, and now it works just as I hoped it would.

Thanks!