javascript - Extjs: Force a component to re-render - Stack Overflow

admin管理员组

文章数量:1348057

I have a custom ponent in ExtJs that is a form field (GridField). It displays a grid as a form field and works as expected. The observations are as follows:

1. When the form is rendered alone (eg. in a window or the first panel in a card layout, everything shows just fine)

2. When the form is is not the first panel in a card layout or is hidden the first time it is rendered, the field name shows and the space required is left but the control does not show.

I did some inspection and found out that the custom ponent is actually rendered but the width of all the html elements (divs, etc) were 0. They all had the style (width:0). My guess is that it is because the form panel was not visible at the time the rendering was done.

In terms of implementation of the control, I am extending Ext.form.field.Base. In initComponent, I simply call this.on('afterrender', this.initControl) to run the custom code for the additional control after render. Here the input field is hidden and the grid is rendered where it is supposed to be.

My questions are 1. How do I force the control to re-render so that the width is no longer 0? 2. If the current implementation is wrong, what is the right way to use a grid or another ext ponent as a form field?

I have a custom ponent in ExtJs that is a form field (GridField). It displays a grid as a form field and works as expected. The observations are as follows:

1. When the form is rendered alone (eg. in a window or the first panel in a card layout, everything shows just fine)

2. When the form is is not the first panel in a card layout or is hidden the first time it is rendered, the field name shows and the space required is left but the control does not show.

I did some inspection and found out that the custom ponent is actually rendered but the width of all the html elements (divs, etc) were 0. They all had the style (width:0). My guess is that it is because the form panel was not visible at the time the rendering was done.

In terms of implementation of the control, I am extending Ext.form.field.Base. In initComponent, I simply call this.on('afterrender', this.initControl) to run the custom code for the additional control after render. Here the input field is hidden and the grid is rendered where it is supposed to be.

My questions are 1. How do I force the control to re-render so that the width is no longer 0? 2. If the current implementation is wrong, what is the right way to use a grid or another ext ponent as a form field?

• javascript
• extjs
• extjs4
• extjs4.2

Share Improve this question Follow edited Oct 28, 2014 at 0:23 abatishchev 100k8888 gold badges301301 silver badges442442 bronze badges asked Mar 15, 2014 at 10:02 ritcoderritcoder 3,2941010 gold badges4545 silver badges6363 bronze badges 1

• The answer to your question is here: stackoverflow./a/7665964/1763602 – Marco Sulla Commented Jan 27, 2016 at 18:13

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Have you tried to call the "doLayout" method to make sure that the dimensions are reapplied correctly? Re-rendering is not mon in Extjs, usually doLayout does the trick. If it doesn't, there may be something up with your implementation itself.

本文标签： javascriptExtjs Force a component to rerenderStack Overflow