Creé una aplicación Ext, que no se ejecuta. Pero ese no es el punto de esta pregunta. Mi pregunta es: para dos áreas de texto dadas, me gustaría hacer crecer la segunda cuando crezca la primera
Ext.application({ name : 'Fiddle', launch : function() { Ext.create('Ext.form.TextArea', { renderTo: Ext.getBody(), width: 500, grow: true, id: 'm1', }); Ext.create('Ext.form.TextArea', { renderTo: Ext.getBody(), width: 500, grow: true, id: 'm2', }); }, });Estaba pensando en:
bind: { height: '{m1.height}', }Pero al intentarlo, eso no funcionó.
Entonces yo estaba pensando en:
var el = Ext.get("m1"); var e2 = Ext.get("m2"); e2.setHeight(e1.getHeight()); Luego, un amigo mío propuso usar el detector de eventos de cambio de resize .
¿Alguna idea de cómo cambiar el enlace para que funcione?
Enlace al violín con el código anterior: https://fiddle.sencha.com/#view/editor&fiddle/3k6s
¿Algo como esto?
Ext.create('Ext.form.FormPanel', { title: 'Sample TextArea', width: 400, bodyPadding: 10, renderTo: Ext.getBody(), items: [{ xtype: 'textareafield', grow: true, name: 'message', fieldLabel: 'Message', anchor: '100%', grow: true, listeners: { resize: function(textArea, width, height) { textArea.nextSibling().setHeight(height) } } }, { xtype: 'textareafield', grow: true, name: 'message', fieldLabel: 'Message', anchor: '100%', grow: true, }]});