ExtJS的/煎茶 - 添加按鈕，彈出的DateField，以清除日期

我將DateField：ExtJS的/煎茶 - 添加按鈕，彈出的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; 
      } 
     } 
    })

編輯這個領域上是禁用的。在任何編輯時，它都顯示彈出窗口，因此任何清除日期都是不可能的。有沒有辦法添加彈出像按鈕今天的東西，但意味着清除，在這個領域的哪個日期將被重置爲00.00.00？

謝謝。

來源

2011-11-19 publikz.com

更新

其製作 - 這裏是代碼： http://publikz.com/?p=1223

來源

2011-11-23 05:43:19

您可以使用DateField的getPicker()方法獲取對Ext.picker.Date組件（負責顯示日曆彈出窗口）的引用。然後，您可以使用配置選項todayText自定義Today按鈕的文本，並通過覆蓋selectToday()方法來自定義點擊時發生的情況。

（如果你想保持Today按鈕原樣，並添加另一個按鈕代替，它可以太完成，通過擴展/定製Ext.picker.date，但它更復雜一些。）

來源

2011-11-19 07:59:42 Tommi

看來我需要添加一個按鈕，已經嘗試一些方法......可你的答案 - 它需要編輯組件還是創建新組件？ –

getPicker - 我沒有找到這個... ext 3/3/4，也許是這個原因... –

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

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

來源

2011-11-19 12:17:01 Thevs

這是我的問題 - 找到它。 Ext3.3.4 –

使用'getPicker（）'方法。 – Thevs

3.3.1 extjs沒有它......無論如何，我重寫方法，現在一切正常。 Tnx求助。 –

嘗試是這樣的：

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

它非常依賴於實現，但它的工作原理。而且你必須這樣標記它，每次你點擊觸發器時它不會呈現另一個清晰的按鈕。

來源

2011-11-23 09:27:03 Krzysztof

有趣的想法，但標記它 - 這是一個問題，我需要重寫幾個metdods - 添加一個showRest屬性，使這個想法生活:)這裏是http://www.sencha.com/forum/showthread.php?106446 -ClearableDateField –

如果有人正在尋找在ExtJS的4這裏一個小的解決方案是我的建議：

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

來源

2016-04-05 13:58:06

ExtJS的/煎茶 - 添加按鈕，彈出的DateField，以清除日期

回答

相關問題