Putting a FormPanel inside a RowExpander?

Question

Is there a way I can build a FormPanel within a RowExpander on a Grid? I'd like to create extjs forms within each row, but right now I'm limited to specifying a template which must be HTML.

That is, I have this:

var expander = new Ext.ux.grid.RowExpander({
    enableCaching: false,
    tpl : new Ext.Template($('#row-expander-template').html())
});

How do I modify this to use Ext JS Forms within the rows?

score 1 · Accepted Answer · answered Jun 17 '11 at 17:53

1

Hilarious hackery:

Use a temporary element as the template, and on the expansion event, render the form to the temporary element and then remove it from the DOM.

answered Jun 17 '11 at 17:53

Stefan Kendall

66,414
68
253
406

score 0 · Answer 2 · answered Jun 13 '11 at 19:44

I haven't tried this, but looking at the source of the RowExpander it seems that a possible way to do it is to render the FormPanel to the expanded row body inside the RowExpander's expand event handler.

However, you also need to clean up the FormPanel when the view gets refreshed. That part is trickier. I think you could probably hook the grid view's beforerefresh event to destroy all the FormPanel instances. However, that wouldn't work with the buffered grid view, and it also means that any sort of view refresh kills anything you were doing in the FormPanels.

Putting a FormPanel inside a RowExpander?

2 Answers2