Extjs radiogroup con los botones

Question

para hacer una caja de herramientas que quiero saber cómo hacer un radiogroup con los botones regulares, no radiobuttons, en Ext.js (más nueva versión)

como este con jQueryUI: http://jqueryui.com/demos/button/#radio

, gracias de antemano, Chielus

Answer 1

Creo que deberías mirar usando un conjunto de botones ExtJS estándar. Un botón se puede asignar a un grupo para que actúen como los elementos que se muestran en su enlace.

Vea este ejemplo:

{ 
    xtype: 'button', 
    text: 'Choice 1', 
    toggleGroup: 'mygroup' 
}, { 
    xtype: 'button', 
    text: 'Choice 2', 
    toggleGroup: 'mygroup' 
}, { 
    xtype: 'button', 
    text: 'Choice 3', 
    toggleGroup: 'mygroup' 
} 

Los botones también tienen una propiedad denominada enableToggle, que les permite alternar, y se establece automáticamente en true cuando se establece una toggleGroup, y toggleGroup dice ExtJS cómo se relacionan.

Tenga en cuenta que se parecen a los botones ExtJS normales, pero que se comporta como usted desea.

Answer 2

Sólo para responder @ comentario de Mastak (en la respuesta anterior), con el fin de no permitir la acción de-de la selección de un botón, añadir este oyente a cada botón:

listeners: { 
    click: function(me, event) { 
     // make sure a button cannot be de-selected 
     me.toggle(true); 
    } 
} 

De esa manera, cada clic en un botón lo volverá a seleccionar.

-DBG

Answer 3

Hay una manera menos complicada (mejor?) Para no permitir anular la selección de un botón. Establecer la opción de configuración allowDepress false:

{ 
    xtype: 'radiogroup', 
    layout: 'hbox', 
    defaultType: 'button', 
    defaults: { 
     enableToggle: true, 
     toggleGroup: 'mygroup', 
     allowDepress: false, 
     items: [ 
      { text: 'Choice 1'}, 
      { text: 'Choice 2'}, 
      { text: 'Choice 3'} 
     ] 
    } 
}