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

Share Improve this question Follow edited Dec 8, 2012 at 3:31 dda 6,21322 gold badges2727 silver badges3535 bronze badges asked Dec 8, 2012 at 3:27 pktCoderpktCoder 1,11522 gold badges1616 silver badges3232 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

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.