¿Cómo agrego un botón a la barra inferior en extjs?

Intento agregar un archivo de texto y un botón al panel de cuadrícula en extjs con el siguiente código:

        var shopIdInput = new Ext.form.TextField({
            emptyText: "请输入商户Id",
            width: 200
        });

        var deleteOneShopCacheBtn = new Ext.Button({
            text : '删除商户缓存',
            handler: deleteOneShopCache,
            minWidth : 100,
            cls: "delBtn"
        });
                 ......
        var grid = new Ext.grid.GridPanel({
            store: store,
            columns: columns,
            bbar: [shopIdInput, deleteOneShopCacheBtn],
            buttons: [clearRedressWordCacheBtn, clearSplitWordCacheBtn, clearRegionCacheBtn, clearCategoryCacheBtn, runCommandBtn],
            items: [commandForm],
            buttonAlign: 'center',
            stripeRows: true,
            autoExpandColumn: 'serverUrl',
            //title: '批量执行指令',
            sm: checkboxSelect,
            frame: true,
            autoHeight: true,
            enableColumnHide: false,
            renderTo : 'serverInfoList'
        });

Pero el botón deleteOneShopCacheBtn en bbar no parece un botón común como el botón clearRedressWordCacheBtn en los botones. Cambia a un botón cuando el mouse está sobre él. Intenté solucionar el problema configurando la propiedad cls y fallé, entonces, ¿qué puedo hacer?

preguntado el 03 de mayo de 12 a las 09:05

2 Respuestas

Por lo general, solo agrego un ícono al botón que ayuda a que se destaque. así que simplemente establezca un valor para iconCls: 'mybuttonicon'

y en tu css .mybuttonicon { background-image: url(../path/to/icon) !important;}

contestado el 08 de mayo de 12 a las 11:05

la configuración de cls le permite especificar clases adicionales a las que aplicar a su objeto renderizable (en su caso, un botón), pero NO hace nada al hacer que cambie en función de que el mouse se desplace sobre él, etc.

Lo que necesita es un oyente en deleteOneShopCacheBtn y escuchar el evento de mouseover (consulte también los documentos de Sencha para ver la lista de eventos a los que responde un botón). Puede activar una función y hacer que su botón se vea como lo desee. Actualmente estoy en el trabajo. Si todavía tiene esta pregunta cuando llegue a casa esta noche, puedo publicar un código.

También vea el siguiente ejemplo:
Evento de clic de botón Ext JS }

contestado el 23 de mayo de 17 a las 13:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.