ExtJS/Sencha - Thêm nút để DateField popup, đến nay

Question

rõ ràng tôi có một 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; 
      } 
     } 
    }) 

Editing của lĩnh vực này bị vô hiệu hóa. Trên bất kỳ chỉnh sửa, nó cho thấy popup, vì vậy bất kỳ ngày rõ ràng là không thể. Có cách nào để thêm vào popup một cái gì đó như nút Hôm nay, nhưng có nghĩa là rõ ràng, sau đó ngày trong lĩnh vực này sẽ được resetted đến 00.00.00?

Cảm ơn.

Answer 1

Cập nhật

của nó thực hiện - đây là mã: http://publikz.com/?p=1223

Answer 2

Bạn có thể tham chiếu đến thành phần Ext.picker.Date (chịu trách nhiệm hiển thị cửa sổ bật lên lịch) với phương thức getPicker() của DateField. Sau đó, bạn có thể tùy chỉnh văn bản của nút Today với tùy chọn cấu hình todayText và tùy chỉnh những gì sẽ xảy ra khi được nhấp bằng cách ghi đè phương thức selectToday().

(Nếu bạn muốn giữ nút Today như nó có, và thêm một nút khác thay vào đó, nó có thể được thực hiện quá, bằng cách mở rộng/tùy Ext.picker.date, nhưng nó là phức tạp hơn một chút.)

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

Hãy thử một cái gì đó như thế này:

{ 
    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); 
    } 
} 

Nó rất phụ thuộc vào triển khai, nhưng nó hoạt động. Và bạn phải gắn cờ theo cách đó sẽ không hiển thị nút rõ ràng khác mỗi khi bạn nhấp vào trình kích hoạt.

Answer 5

Nếu bất cứ ai đang tìm kiếm một giải pháp nhỏ trong ExtJS 4 ở đây là đề nghị của tôi:

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