Extjs checkbox and textarea - how to disable the checkbox on scroll behavior of the textarea?

I have a text area that displays some text with a vertical scroll bar on the right and a checkbox below the text area as in the code below:

xtype: 'container',
items: [{
    {
        xtype: 'textarea',
        scrollY: true,
        screenX: true,
        height: 130,
        minHeight: 80,
        top: 10,
        width: 650,
        id: 'testDisplay',
        name: 'testDisplay',
        itemId: 'testDisplay',
        bind: {
            value: some text
        },
        listeners: {
            afterrender: function(cmp) {
                textAreaComp = me.down('#testDisplay');
                textAreaComp.setValue(someInfo);
            }
        },
    }, 
    {
        xtype: 'checkboxfield',
        name: 'testDisplayChkbox',
        id: 'testDisplayChkbox',
        itemId: 'testDisplayChkbox',
        checked: false,
        boxLabel: someLabel,
    }
}]

I am looking to disable the checkbox at first and then enable it after scrolling to the end of the text area located above the checkbox. How can this be achieved?