1. #1
    Sencha User
    Join Date
    Sep 2012
    Location
    Oslo
    Posts
    7
    Vote Rating
    0
    SergioKastro is on a distinguished road

      0  

    Default Answered: How to disable the inputEl of a textfield in ExtJS?

    Answered: How to disable the inputEl of a textfield in ExtJS?


    I am working with ExtJS and I have a textfield component. I would like to disable only the inputEl of a textfield component (not the label).
    If I use the setDisabled() method of the textfield, then it sets disabled the inputEl but also the label.
    I have used also the setReadOnly() method, but it does not grey out the inputEl, only set asReadOnly.
    Is there a way to disable only the inputEl of a textfield component?
    Thanks for your help.

  2. You need to access labelEl of the textfield and set the opacity on that element.
    Here is the sample working code:

    Code:
    Ext.onReady(function () {
        var panel =Ext.create('Ext.form.Panel', {
            title: 'Basic Form',
            renderTo: Ext.getBody(),
            bodyPadding: 5,
            width: 350,
            items: [{
                xtype: 'textfield',
                fieldLabel: 'Field',
                name: 'theField',
              disabled: true
            }]        
        });
      
       panel.down('[xtype=textfield]').labelEl.setOpacity(1);
    });
    Thanks,
    Sriram

  3. #2
    Sencha Premium Member
    Join Date
    Apr 2012
    Posts
    41
    Answers
    6
    Vote Rating
    2
    sriram139 is on a distinguished road

      1  

    Default Use setOpacity() on labelEl

    Use setOpacity() on labelEl


    You need to access labelEl of the textfield and set the opacity on that element.
    Here is the sample working code:

    Code:
    Ext.onReady(function () {
        var panel =Ext.create('Ext.form.Panel', {
            title: 'Basic Form',
            renderTo: Ext.getBody(),
            bodyPadding: 5,
            width: 350,
            items: [{
                xtype: 'textfield',
                fieldLabel: 'Field',
                name: 'theField',
              disabled: true
            }]        
        });
      
       panel.down('[xtype=textfield]').labelEl.setOpacity(1);
    });
    Thanks,
    Sriram

  4. #3
    Sencha User
    Join Date
    Sep 2012
    Location
    Oslo
    Posts
    7
    Vote Rating
    0
    SergioKastro is on a distinguished road

      0  

    Default


    My approach was to create a custom class which is doing the same, setting the opacity. But your solution is much better.

    Thank you Sriam.

Thread Participants: 1

Tags for this Thread