1. #1
    Ext Premium Member yyogev's Avatar
    Join Date
    Jun 2009
    Location
    Shoham, Israel
    Posts
    196
    Answers
    5
    Vote Rating
    6
    yyogev is on a distinguished road

      0  

    Question Answered:  How to dynamically change the background-color of a text area field ?

    Answered:  How to dynamically change the background-color of a text area field ?


    Hi,

    I want to dynamically change the background color of a text area field when a certain checkbox is checked.

    Attached is my example attempt to do this:

    textarea_bg_example.zip

    Thanks,
    Yaron Yogev

    IT Software Developer

  2. See if this will help:

    Code:
    .red-editor textarea
    {
        background: none;
        background-color: red;
        padding-top: 5px;
    }
    
    .blue-editor textarea
    {
        background-color: blue;
    }
    ​​
    Code:
    var form = Ext.create('Ext.form.FormPanel', {
        title      : 'Sample TextArea',
        width      : 400,
        bodyPadding: 10,
        renderTo   : Ext.getBody(),
        items: [{
            xtype     : 'textareafield',
            grow      : true,
            name      : 'message',
            fieldLabel: 'Message',
            anchor    : '100%',
            cls: 'red-editor'
        }]
    });
    
    
    Ext.create('Ext.Button', {
        text: 'Click me',
        renderTo: Ext.getBody(),
        handler: function() {
            var ta = form.down('textareafield');
            ta.addCls('blue-editor');
        }
    });
    ​
    Regards,
    Scott.

  3. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,637
    Answers
    613
    Vote Rating
    400
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    See if this will help:

    Code:
    .red-editor textarea
    {
        background: none;
        background-color: red;
        padding-top: 5px;
    }
    
    .blue-editor textarea
    {
        background-color: blue;
    }
    ​​
    Code:
    var form = Ext.create('Ext.form.FormPanel', {
        title      : 'Sample TextArea',
        width      : 400,
        bodyPadding: 10,
        renderTo   : Ext.getBody(),
        items: [{
            xtype     : 'textareafield',
            grow      : true,
            name      : 'message',
            fieldLabel: 'Message',
            anchor    : '100%',
            cls: 'red-editor'
        }]
    });
    
    
    Ext.create('Ext.Button', {
        text: 'Click me',
        renderTo: Ext.getBody(),
        handler: function() {
            var ta = form.down('textareafield');
            ta.addCls('blue-editor');
        }
    });
    ​
    Regards,
    Scott.

  4. #3
    Ext Premium Member yyogev's Avatar
    Join Date
    Jun 2009
    Location
    Shoham, Israel
    Posts
    196
    Answers
    5
    Vote Rating
    6
    yyogev is on a distinguished road

      0  

    Thumbs up The CSS selector was the problem

    The CSS selector was the problem


    It works after the CSS class definition was modified.

    The same CSS class definition was used with an ExtJS 3 text area field, and apparently in ExtJS 4 the text area field structure was changed so it became necessary to add the 'textarea' selector to the CSS class definition.

    Thanks,
    Yaron Yogev

    IT Software Developer

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar