Dynamically adding plugins to grid

[nandavanan]

Hi,

I have grid with plugins like this.

var grd = new Ext.grid.GridPanel({
    	frame: true,
    	minHeight: 200,
    	plugins: [groupSummary,gridSummary,group],
    });

Assume that I have rendered the grid and loaded the store for the same.
Now "after loading the grid", when I click on a button, or any event for that matter, I want to
a) remove all the plugins for the grid,
b) add new plugins and
c) refresh the gridView, "without reloading the store" for the grid.

Any ideas how to get this done?

Any advice is appreciated.

Thanks,
nandavanan

[jay@moduscreate.com]

Please post in the Ext Help section next time. Community Discussion is not the proper place.


Moving to Ext help.

[jay@moduscreate.com]

There is no proper way to "destroy" or "remove" plugins in Ext JS 3.x. Lots of plugins don't have proper destroy methods. Even if they do (like the ones I've developed), you would have to manually remove them from the "plugins" array.

[nandavanan]

Thank you for getting back to me.

If I have plugin_array = [array_of_plugins] and I loaded a grid with this plugin. I, then manipulate the plugins array, new_plugin_array = [new_array_of_plugins]. Now, how do I make the grid look at this new array of plugins for its plugins?

Is there a function or a property like grid.add({plugins: new_plugin_array}) ?

Thank again.

[jay@moduscreate.com]

var newPlugin = new MyPlugin();
newPlugin.init(grid);
grid.plugins.push(newPlugin);

[nandavanan]

Okay, this looks good.

I was able to change the plugins for the grid. But, they do not seem to have any effect on the grid.

I am using grid.view.refresh() function to apply the new plugins. Am I supposed to use any other function?

Also, I am using the columnHeaderGroup plugin. My requirement is to change this plugin, remove its previous version from the grid and add the new version to the same. I also add columns and change the way the values are calculated. All the changes are taking effect except the grouping of headers.

Thank for the help.

[Condor]

No need to replace the ColumnHeaderGroup plugin. You only need to change the rows property of the columnmodel.

[nandavanan]

Hi,

I got what you meant...to have the columheadergroup for the to-be-added columns ready even before the grid is created. This worked.

But, I am worried about the layout.

I have attached the screen-shot ( tgl-effect-scrn.jpg )of the grid column headers before and after the toggle. As you can in the "after toggle" screen-shot, the width of the newly added columns under "G" are larger in width.

Any ideas how to spread the column widths evenly?

Thank you once again. Let me know if you need me to open a new thread for this.

[pankajsharma]

image1.jpg

I am dynamically adding column to grid and after addition Ext.ux.grid.FilterRow is not retained.
so i used below mentioned code but still no luck.

var filterRow = new Ext.ux.grid.FilterRow();
filterRow.init(grid);
grid.plugins.push(filterRow);
grid.getView().refresh();

[MarkMan55]

Bumping this thread. I'm running into the exact same issue and have found the same recommendation in other threads and forums -- which does not work, at least with 3.2.1

Note: the plugin I'm using is RowExpander
I've tried different variations of:

var myExpander = new Ext.ux.grid.RowExpander({...});
myExpander.init(grid)
grid.plugins.push(myExpander);
grid.getView().refresh();

Would love to see another suggestion, thanks!