ExtJs TextField con un pequeño botón

Question

¿Cómo crear un botón pequeño con el icono dentro del campo de texto, como con datefield? En la versión anterior de ExtJS había una CompositeField pero no lo encuentro en ExtJS 4.

Answer 1

Sólo extender http://docs.sencha.com/ext-js/4-1/#!/api/Ext.form.field.Trigger Puede cambiar el icono de la zona de activación con CSS y poner en práctica el comportamiento de clic en el icono en el método onTriggerClick plantilla

Ext.define('Ext.ux.CustomTrigger', { 
    extend: 'Ext.form.field.Trigger', 
    alias: 'widget.customtrigger', 

    // override onTriggerClick 
    onTriggerClick: function() { 
     Ext.Msg.alert('Status', 'You clicked my trigger!'); 
    } 
}); 

Ext.create('Ext.form.FormPanel', { 
    title: 'Form with TriggerField', 
    renderTo: Ext.getBody(), 
    items:[{ 
     xtype: 'customtrigger', 
     fieldLabel: 'Sample Trigger', 
     emptyText: 'click the trigger' 
    }] 
}); 

Answer 2

¿Se puede hacer clic en el icono? Si es así, está buscando Ext.form.field.Trigger. De lo contrario, puede intentar anular la función getSubTplMarkup() del campo de texto para proporcionar un dom personalizado.

Por ejemplo:

Ext.define('MyField', { 
    extend: 'Ext.form.field.Text', 

    getSubTplMarkup: function() { 
     return this.callParent(arguments) + '<span class="my-icon"></span>'; 
    } 
});