4

データの読み取り専用ビューを表示する必要があります。これを行うために DisplayField コンポーネントを選択しました。私の問題はBasicForm.setValues(values)、displayFields の 1 つで日付文字列を呼び出して自動的に正しくレンダリングする簡単な方法が欲しいということです。私のためにこれを行うもの(レンダラー関数など)は見つかりませんでした..を呼び出す前に日付文字列を手動でフォーマットしようとしていますsetValues(values). これを行うための巧妙な方法はありますか?

ありがとう!

4

5 に答える 5

6

ダイレクト フォーム ロードを使用している場合は、フォームの BasicForm 'actioncomplete' イベントをリッスンする必要があります。このイベントが発生すると、ハンドラーに 2 つの引数が提供されます。最初の引数は BasicForm で、2 番目の引数は Ext.form.Action オブジェクトです。特に Ext.form.Action.Load オブジェクトを探しています。ここから、アクションの result.data オブジェクトにアクセスし、このハンドラーが戻って値がフォームにロードされる前に、データ値を処理できます。

function fmtDate(sf, rec) {
  if ( rec[sf] ) {
    var dt = new Date(); dt.setTime(rec[sf] * 1000); return dt.format('l j F Y');
  }
};

myForm.getForm().on({
  actioncomplete: function(form, action) {
    if (action.type === 'load') {
      if (action.result.success) {
        var data = action.result.data;
        data.someFormattedDate = fmtDate('myDateTS', data);
      } else {
        //handle an error here
      }
    }
  }
});

フォームに必要なのは、'someFormattedDate' という名前の displayField と、Bob の叔父さん (オージー スラングですべて良いことを意味します) だけです。myForm.getForm().load() 呼び出しに「success:」関数を指定することで、まったく同じことを達成することもできます。Ext.form.Action.Load の ExtJS ドキュメントを参照してください。乾杯、t00bs。

于 2010-12-15T05:48:53.770 に答える
3

最終的にdisplayFieldをサブクラス化しました。これが最も効果的であるように見えますが、フォーマットされた日付を表示するのと同じくらい基本的なものに対して、すぐに使用できる修正があればいいのにと思います。これは私の最初のパスなので、単なる例です。

    FormattableDisplayField = Ext.extend(Ext.form.DisplayField, {

constructor:function(config) {
    var config = config || {};

    Ext.applyIf(config, {
        dateFormat:'c',
        type:null,
        displayFormat:'M d, Y'
    });


    FormattableDisplayField.superclass.constructor.call(this, config);
},

setValue: function(value) {

    if (! this.type) {
        FormattableDisplayField.superclass.setValue(value);
    }

    else if (this.type == 'date') {

        var parsedDate = Date.parseDate(value, this.dateFormat);
        if (Ext.isDate(parsedDate)) {
            this.setRawValue(parsedDate.format(this.displayFormat));
        }
        else {
            this.setRawValue(value);
        }
    }

    else if (this.formatter) {
        var formattedValue = this.formatter(value);
        this.setRawValue(formattedValue);
    }


}

});Ext.reg('formattabledisplayfield', FormattableDisplayField);
于 2010-12-07T20:41:20.993 に答える
1

日付をUnixタイムスタンプとして渡すのが好きで、コンテキストに応じてさまざまな形式を使用して日付を表示する必要があったため、これと同じ問題が発生しました。これが私がそれをした方法です。

ストアを介してデータをロードする場合は、Ext.data.Fieldが提供する変換関数を使用できます。例えば:

var fields = [

  {name: 'sysTestedDateObj', mapping: 'sysTestedDateTS', type: 'date', dateFormat: 'timestamp'},

   /** Converted Fields **/
   {name: 'sysTestedDate', convert: function(v, rec){
      return fmtDate('sysTestedDateTS', rec);
   }},

   {name: 'targetChangeStartDate', convert: function(v, rec){
      return fmtDate('targetChangeStartDateTS', rec);
   }},

   {name: 'createDateTime', convert: function(v, rec){
      return fmtDateTime('createDateTS', rec);
   }},

   {name: 'modifyDateTime', convert: function(v, rec){
      return fmtDateTime('modifyDateTS', rec);
   }},
];

var store = new Ext.data.JsonStore({
  ...
  fields: fields
});

いくつかの変換関数は次のとおりです。

function fmtDate(sf, rec) {
  if ( rec[sf] ) {
    var dt = new Date(); dt.setTime(rec[sf] * 1000); return dt.format('l j F Y');
  }
};

function fmtDateShort(sf, rec) {
  if ( rec[sf] ) {
    var dt = new Date(); dt.setTime(rec[sf] * 1000); return dt.format('D j M Y');
  }
};

function fmtDateTime(sf, rec) {
  if ( rec[sf] ) {
    var dt = new Date(); dt.setTime(rec[sf] * 1000); return dt.format('l j F Y h:i a');
  }
};

function fmtDateTimeShort(sf, rec) {
  if ( rec[sf] ) {
    var dt = new Date(); dt.setTime(rec[sf] * 1000); return dt.format('D j M Y h:i a');
  }
};

ここで、sfは、フォーマットされた日付文字列を取得するソースフィールドです。

次のことに注意してください、それは重要です。convert()関数は、リーダーによって読み取られたデータレコードのコピーとともに提示されます(これはExtJSドキュメントにあります)。これは、変換でマップされたフィールドを使用できないことを意味します。上記のfields配列には、次のように定義されたフィールドがあります。

{name: 'sysTestedDateObj', mapping: 'sysTestedDateTS', type: 'date', dateFormat: 'timestamp'}

したがって、sysTestedDateTSフィールドからsysTestedDateObj日付オブジェクトを作成しており、Unixタイムスタンプを含むオブジェクトから派生した日付オブジェクトを取得するように読者に指示しました。これは後で使用するのに適したオブジェクトですが、変換関数に渡されるデータレコードの一部にはなりません。

また、変換関数は、ストアで使用するために定義されていないレコード内のフィールドを参照できることに注意してください。上記の例では、サーバーがJSON応答でフィールドsysTestedDateTSを提供していることがわかっているため、変換関数でフィールドsysTestedDateTSを使用していますが、fields配列で定義していないため、ストアを介してコンポーネントを消費します。

于 2010-12-14T04:29:49.530 に答える
0

http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Format

dateRenderer はあなたが探しているレンダラー関数だと思いますか?

于 2010-12-07T17:46:51.400 に答える