テキストフィールドで日付値を編集する方法

Question

ExtJsにはdatetimeフィールドがないので、グリッド内のdatetime値を編集する最も簡単な方法は、テキストフィールドを使用することでした。私はフィールドを検証し、ユーザーのためにレコードを透過的に更新する簡単な例は見つけられませんでした。

これは私が私のエディタを追加したい私のグリッド内の列、

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)} 
     } 
    }] 
})