Tengo diseño de formulario con algunos elementos de TextField y un elemento HtmlEditor. Algunos elementos de TextField son "ocultos", es decir, podrían ocultarse o mostrarse. Después de ocultar/mostrar los elementos HtmlEditor, diseño de interrupción de instancia, aparece el espacio vacío o el elemento no termina en el borde de la ventana.ExtJS: diseño de ajuste dinámico después de agregar/eliminar algunos campos de formulario
¿Es posible decirle a la instancia de HtmlEditor que use todo el espacio restante disponible? Incluso en caso de que algunos elementos estén ocultos/mostrados.
He intentado utilizar la propiedad anchor
, pero funciona bien hasta que algún elemento se elimine del diseño.
Actualizado Aquí es un ejemplo de código:
var htmlEditor = new Ext.form.HtmlEditor({
anchor: '100% -54',
hideLabel: true
});
var fp = new Ext.form.FormPanel({
items: [{xtype: 'textfield', fieldLabel: 'zzz', mode: 'local'},
{xtype: 'textfield', fieldLabel: 'nnn', id: 'id-one', mode: 'local'},
htmlEditor]
});
var w = new Ext.Window({layout: 'fit',
height: 400, width: 600,
tbar: [{text: 'click',
handler: function() {
// hide element
Ext.getCmp('id-one').getEl().up('.x-form-item').setDisplayed(false);
w.doLayout();
}
}],
items: fp
});
w.show();
ejecutar, haga clic en la barra de herramientas botón "clic", un campo debe desaparecer, y luego mirar espacio vacío debajo HTMLEditor.
No ayuda realmente. Cuando algún elemento simplemente está oculto, aparece un espacio vacío debajo de HtmlEditor (o textarea). –
Mi comentario asume que (A) sus widgets están configurados con el anclaje adecuado, y (B) todos los contenedores anidados tienen un diseño apropiado configurado. Si tienes otras cosas configuradas incorrectamente, doLayout() no será de ayuda, pero como no has publicado ningún código, es imposible saber cuál podría ser el problema. –
Una cosa más: suponiendo que tiene un diseño de aplicación complicado, para resolver este problema debe codificar un caso de prueba simple con un FormPanel no anidado y con suficientes campos y código de diseño para probar su escenario. Una vez que tenga ese trabajo, será más fácil averiguar qué es lo que necesita cambiar en el código de su aplicación. Tu caso de uso es bastante alcanzable ya que he hecho exactamente lo mismo antes. –