2

ウィンドウ内のフォームのすべての「テキストフィールド」に変更イベントを追加するにはどうすればよいですか?まず、フォームを使用してウィンドウを作成します。すべてのフィールドは値0で初期化されます。ユーザー入力を検出したいと思います(おそらくdirtychangeを使用)。1より大きい場合は、textFieldの背景色を変更します。

これは現時点での私のコードです:

Ext.define('WPT.view.HoursPerMonthWindow', {
  extend: 'Ext.window.Window',
  alias : 'widget.hourspermonthwindow',
  title : 'Hours per Months',
  layout: 'fit',
  autoShow: true,   

  initComponent: function() {
    this.items = [
    {
        xtype: 'form',           
        items: [
        {
            xtype: 'textfield',
            name : 'january',
            itemId: 'january',
            fieldLabel: 'January'            
        },
        {
            xtype: 'textfield',
            name : 'february',
            itemId: 'february',
            fieldLabel: 'February'
        }
        ,
        {
            xtype: 'textfield',
            name : 'march',
            itemId: 'march',
            fieldLabel: 'March'
        },
        {
            xtype: 'textfield',
            name : 'april',
            itemId: 'april',
            fieldLabel: 'April'
        },
        {
            xtype: 'textfield',
            name : 'may',
            itemId: 'may',
            fieldLabel: 'May'
        },
        {
            xtype: 'textfield',
            name : 'june',
            itemId: 'june',
            fieldLabel: 'June'
        },
        {
            xtype: 'textfield',
            name : 'july',
            itemId: 'july',
            fieldLabel: 'July'
        },
        {
            xtype: 'textfield',
            name : 'august',
            itemId: 'august',
            fieldLabel: 'August'
        },
        {
            xtype: 'textfield',
            name : 'september',
            itemId: 'september',
            fieldLabel: 'September'
        },
        {
            xtype: 'textfield',
            name : 'october',
            itemId: 'october',
            fieldLabel: 'October'
        },
        {
            xtype: 'textfield',
            name : 'november',
            itemId: 'november',
            fieldLabel: 'November'
        },
        {
            xtype: 'textfield',
            name : 'december',
            itemId: 'december',
            fieldLabel: 'December'
        }                   
        ]           
    }
    ];

    this.buttons = [
    {
        text: 'Save',
        action: 'save'
    },
    {
        text: 'Cancel',
        scope: this,
        handler: this.close
    }
    ];

    this.callParent(arguments);
  }
})

この問題に関するヒントはありますか?あなたの助けのためのThxマネル

4

3 に答える 3

2

Extjsは、リスナーを追加する非常に簡単な方法、特にextjs4mvcアーキテクチャを提供します。ビューのコントローラーにリスナーを追加する必要があります

Ext.define('App.controller.SomeController', {
    extend:'Ext.app.Controller',
    init:function () {
       this.control({
            'hourspermonthwindow > form > textfield':{
                change: this.handleOnChange
            }
       });
    },
    handleOnChange:function(textfield,newValue,oldValue){
    //your code here
    }
});
于 2012-08-31T13:18:24.943 に答える
1

textfieldそこにリスナーを拡張して追加する新しいコンポーネントを定義し、それをフォームで使用します。

単純なchangeリスナーだけが機能するはずです。

次に、色を使用してcssクラスを追加します。または、行ごとに異なる色が必要な場合は、コードを使用して設定colorし、新しいコンポーネントに渡すカスタム変数を使用します。

于 2012-08-31T12:41:34.770 に答える
1

それ以外の {xtype : 'textfield' ... }

フィールド新しいExt.form.TextFieldがあり、これを試して完全に機能します

new Ext.form.TextField({enableKeyEvents: true ,
    listeners : {
        change : function (f, e){
            action_form_update_brdoutput(null, frmBRDOutput.getForm().getValues());
        }
    }
})

Extjsはリスナーを提供するので、リスナーをオーバーロードできます。

于 2012-10-10T14:06:27.957 に答える