Results 1 to 5 of 5

Thread: how to get the caret position in a textareafield

  1. #1
    Sencha User
    Join Date
    Apr 2019
    Posts
    7

    Default Answered: how to get the caret position in a textareafield

    I'm quite new to Extjs,
    I need to get de cursor position in a textareafield after a button is clicked, but always it returns undefined. Here is what I have:

    Code:
    Ext.define({
                xtype: 'container',
                renderTo: Ext.getBody(),
                layout: 'vbox',
                padding: 20,
                defaults: {
                    xtype: 'button',
                    margin: '0 0 12 0'
                },
    
                items: [
                    {
                        xtype: 'textareafield',
                        grow: false,
                        width: 545,
                        height: 120,
                        name: 'message',
                        fieldLabel: '',
                        id: 'mytextarea',
                        anchor: '100%'
                    },
                    {
                        xtype: 'button',
                        text: 'Go',
                        scale: 'medium',
                        id: 'mybutton',
                        listeners: {
                            click: function() {
                                var zone = Ext.getCmp('mytextarea');
                                var text = zone.getValue();
                                var posic = zone.el.dom.selectionStart;
    
                                console.log(posic); // undefined
                            }
                        }
                    }
                ]
            });
    Please help

  2. Quick Example;


  3. #2
    Sencha MVP Team Member
    Join Date
    Sep 2016
    Location
    Kennewick, WA
    Posts
    147
    Answers
    15

    Default

    You would have to write something extremely custom to achieve what you are requesting. Simple websites you will find when you "click" a button the cursor has already lost focus of the textarea. It is the nature of web development. One such possibility is

    Code:
    items: [
                    {
                        xtype: 'textareafield',
                        grow: false,
                        width: 545,
                        height: 120,
                        name: 'message',
                        fieldLabel: '',
                        id: 'mytextarea',
                        anchor: '100%',
                        listeners: {
                           focusleave: function (textareafield, event, eopts) {
                               var x = event.clientX // Get the horizontal coordinate
    var y = event.clientY // Get the horizontal coordinate
                           }
                        }
                    },
                    {
                        xtype: 'button',
                        text: 'Go',
                        scale: 'medium',
                        id: 'mybutton',
                        listeners: {
                            click: function() {
                                var zone = Ext.getCmp('mytextarea');
                                var text = zone.getValue();
                                var posic = zone.el.dom.selectionStart;
    
                                console.log(posic); // undefined
                            }
                        }
                    }
                ]
    Andy Allord
    Sencha MVP/Software Engineer

  4. #3
    Sencha User
    Join Date
    Apr 2019
    Posts
    7

    Default

    Mr. aallord, I thank you for your time and your response. I see your point, but I still can not get this working.

  5. #4
    Sencha Premium User
    Join Date
    Feb 2010
    Location
    Chicago
    Posts
    71
    Answers
    17

    Default

    Quick Example;


  6. #5
    Sencha User
    Join Date
    Apr 2019
    Posts
    7

    Default

    @Jonny Major, you saved my day. Thanks!!!

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •