1. #1
    Sencha User
    Join Date
    Aug 2012
    Location
    Zurich
    Posts
    5
    Vote Rating
    0
    amanyosa is on a distinguished road

      0  

    Default Unanswered: Textareafield scrollHeight not updated

    Unanswered: Textareafield scrollHeight not updated


    Hi all,

    I'm using some textarefields and I want to resize them when the content fills. There are several examples like this:
    http://stackoverflow.com/questions/9...n-sencha-touch

    In short, the code is
    keyup: function(field) {

    var TEXTAREA_LINE_HEIGHT = 20;
    var textarea = field.element.dom;
    var newHeight = textarea.scrollHeight;
    var currentHeight = textarea.clientHeight;

    console.log('newHeight1 = ' + newHeight + ' currentHeight ' + currentHeight);
    if (newHeight > currentHeight) {
    textarea.style.height = newHeight + 5 * TEXTAREA_LINE_HEIGHT + 'px';
    }
    }
    The problem is that .element.dom.scrollHeight always has the same value as field.element.dom.clientHeight.

    Anyone has experienced this?
    Thanks a lot!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Answers
    3541
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Ran this code on my iPhone using ST 2.1.0 RC1 and the scrollHeight is different than the clientHeight:

    Code:
    Ext.Viewport.add({
        xtype : 'formpanel',
        items : [
            {
                xtype : 'textareafield'
            },
            {
                xtype   : 'button',
                text    : 'View',
                handler : function(btn) {
                    var form         = btn.up('formpanel'),
                        field        = form.down('textareafield'),
                        el           = field.getComponent().input,
                        scrollHeight = el.dom.scrollHeight,
                        clientHeight = el.dom.clientHeight;
    
                    alert(scrollHeight + ' - ' + clientHeight);
                }
            }
        ]
    });
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1