ExtJS/Sencha - Añadir botón para DateField emergente, hasta la fecha

Question

borrar Tengo un DateField:

editor : new Ext.form.DateField({ /*Ext.ux.form.Custom*/ 
     allowBlank: true, 
     format: 'm/d/Y', 
     width : 120, 
     enableKeyEvents: true, 
     listeners: { 
       'keydown' : function (field_, e_ ) { 
       field_.onTriggerClick(); 
       e_.stopEvent(); 
       return false; 
      }, 
       'focus' : function (field_ ) { 
       field_.onTriggerClick(); 
       e_.stopEvent(); 
       return false; 
      } 
     } 
    }) 

edición de este campo se desactiva. En cualquier edición, muestra ventana emergente, por lo que cualquier fecha de caducidad es imposible. ¿Hay alguna manera de agregar algo emergente como el botón Hoy, pero que significa Borrar, después de lo cual la fecha en este campo se restablecerá a 00.00.00?

Gracias.

Answer 1

Actualizado

Su hizo - aquí está el código: http://publikz.com/?p=1223

Answer 2

Puede obtener una referencia al componente Ext.picker.Date (responsable de mostrar el calendario emergente) con el método getPicker() de DateField. A continuación, puede personalizar el texto del botón Today con la opción de configuración todayText y personalizar lo que sucede cuando se hace clic sobreponiéndolo al método selectToday().

(Si desea mantener el botón Today tal como es, y añadir otro botón en su lugar, se puede hacer también, mediante la extensión/personalización de Ext.picker.date, pero es un poco más complicado.)

Answer 3

calendar = ..... // find the calendar component 

clearDateButton = new Ext.Button({ 
    renderTo: calendar.el.child("td.x-date-bottom,true"), 
    text: "Clear Date", 
    handler: ...... 
}) 

Answer 4

intentar algo como esto:

{ 
    xtype: 'datefield', 
    onTriggerClick: function() { 
     Ext.form.DateField.prototype.onTriggerClick.apply(this, arguments); 
     var btn = new Ext.Button({ 
      text: 'Clear' 
     }); 
     btn.render(this.menu.picker.todayBtn.container); 
    } 
} 

Depende mucho de la implementación, pero funciona. Y debe marcarlo de esa manera, no generará otro botón claro cada vez que haga clic en el desencadenador.

Answer 5

Si alguien está buscando una solución pequeña en ExtJS 4 He aquí mi sugerencia:

Ext.picker.Date.override({ 
     beforeRender: function() { 
      this.clearBtn = new Ext.button.Button({ 
       text: 'Clear', 
       handler: this.clearDate, 
       scope: this 
      }); 
      this.callOverridden(arguments); 
     }, 
     initComponent: function() { 
      var fn = function(){}; 
      var incmp = function(values, out){ 
       Ext.DomHelper.generateMarkup(values.$comp.clearBtn.getRenderTree(), out); 
       fn(values, out); 
      }; 
      if(this.renderTpl.length === undefined){ 
       fn = this.renderTpl.initialConfig.renderTodayBtn; 
       this.renderTpl.initialConfig.renderTodayBtn = incmp; 
      } else { 
       fn = this.renderTpl[this.renderTpl.length-1].renderTodayBtn; 
       this.renderTpl[this.renderTpl.length-1].renderTodayBtn = incmp; 
      } 
      this.callOverridden(arguments); 
     }, 
     finishRenderChildren: function() { 
      this.clearBtn.finishRender(); 
      this.callOverridden(arguments); 
     }, 
     clearDate: function(){ 
      this.fireEvent('select', this, ''); 
     } 
    }); 

Working ExtJS Fiddle