2

私たちのアプリケーションには、テキストフィールドとチェックボックスがあります。デフォルトでは、テキストフィールドは読み取り専用です。チェックボックスがチェックされているときはいつでも、テキストフィールドは編集可能でなければなりません。

上記の要件を満たすことができます。しかし、テキストフィールドが読み取り専用の場合、ユーザーが編集できないと感じるような方法でテキストフィールドを表示する必要もあります。

これには以下のコードを使用しました。

{
   xtype:'textfield',
   id:'textfieldid',
   readOnly:true,
   fieldCls:'x-item-disabled'
    ...
}


{
    xtype:'checkbox',
    listeners:{
        change:function(thisCmp,newValue,oldValue){
                if(newValue==true){
                    Ext.getCmp('textfieldid').addCls('x-item-disabled');
                } else {
                    Ext.getCmp('textfieldid').removeCls('x-item-disabled');
                }
            }
    }
}

しかし、いくつかの方法でそれを機能させることができません。

誰かがそれを解決する方法を提案してもらえますか?

実際には、そのフィールドを提出する必要があります。無効になっている場合、そのフィールドは送信されません。そこで、fieldCls を動的に設定してみました。

4

1 に答える 1

2

setDisabledのメソッドを使用できませんExt.form.field.Textか?

{
    xtype:'checkbox',
    listeners:{
        change:function(thisCmp,newValue,oldValue){
             Ext.getCmp('textfieldid').setDisabled(newValue);
        }
    }
}

fieldCls:'x-item-disabled'また、メソッドによって自動的に管理される TextField の構成として指定しないでsetDisabledください。最初にテキスト フィールドを無効としてレンダリングする場合は、次disabled : trueのように構成で使用できます。

{
   xtype:'textfield',
   id:'textfieldid',
   disabled: true
    ...
}

別のオプション：

最初に fieldCls プロパティを使用して無効化クラスを指定していますが、これは間違っている可能性があります。代わりに、このようなことを行うことができます

{
   xtype:'textfield',
   id:'textfieldid',
   readOnly:true,
   listeners : {
       afterrender : function() {
            this.addCls('x-item-disabled');
       },
       scope : this
   }
    ...
}
于 2013-03-15T20:08:02.267 に答える