This question probably is asked in other framework, not sure if there is one on ExtJs, which I am new to. I wonder whether there is a simple example with a TextArea and a button. When the button is pressed, a fixed string "???" is inserted at the cursor in the TextArea.

Thanks in advance.

This question probably is asked in other framework, not sure if there is one on ExtJs, which I am new to. I wonder whether there is a simple example with a TextArea and a button. When the button is pressed, a fixed string "???" is inserted at the cursor in the TextArea.

Thanks in advance.

• javascript
• extjs
• textarea

2 Answers 2

You can actually do this straight from the DOM, using textareas selectionStart attribute to find the caret position.

So you could do something along the lines of

textArea.value = textArea.value.substring(0, selectionStart)+'???'+textArea.value.substring(selectionStart);

Here is a jsfiddle demonstrating this using a bination of Ext.get and Ext.getDom to select and modify the elements.

In extjs 7.5.1 (maybe older), you can get the cursor position with the getCaretPos() method of the textArea object :

    var textToInsert = 'test';
    var txtArea = Ext.ComponentQuery.query('#yourTextAreaItemId')[0];
    var currentContent = txtArea.getValue();
    var caretPos = txtArea.getCaretPos();

    txtArea.setValue(currentContent.substring(0,caretPos) + textToInsert + currentContent.substring(caretPos));

Beware that this method does not seem to be documented in the framework docs so beware of possible updates.