如何使用文本字段編輯日期值

Question

由於ExtJs缺少日期時間字段，我想在網格中編輯日期時間值的最簡單方法是使用文本字段。我沒有找到一個驗證該字段併爲用戶透明更新記錄的簡單示例。

這是我的網格，在這裏我想補充我的編輯欄

Ext.define('Fiddle.grid.DateEdit', { 
    columns: [{ 
     text: 'Datetime value', 
     dataIndex: 'mydatetime', 
     xtype:'datecolumn', 
     format: 'Y-m-d H:i:s' 
    }] 
}) 

Answer 1

這是一種簡約的方式，來處理驗證和日期字符串轉換透明地爲用戶：

Ext.define('Fiddle.grid.DateEdit', { 
    columns: [{ 
     text: 'Datetime value', 
     dataIndex: 'mydatetime', 
     xtype:'datecolumn', 
     format: 'Y-m-d H:i:s', 
     editor: { 
      xtype:'textfield', 
      errorMessage: 'Invalid date format', 
      format: 'Y-m-d H:i:s', 
      validator: function(val){return val.match(/\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/) ? true : this.errorMessage}, 
      valueToRaw: function(val){return Ext.Date.format(val, this.format)}, 
      rawToValue: function(val){return Ext.Date.parse(val, this.format)} 
     } 
    }] 
})