# Add text in a text Area at the cursor position

**URL:** <https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [March 20, 2024, 3:52pm UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637 "2024-03-20T15:52:18Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [March 20, 2024, 3:52pm UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637/1 "2024-03-20T15:52:18Z")

</div>

I would like to add some text when I click on a button in a perspective text area component at the current editing cursor position in the text Area.

not sure it can be done in perspective ?

---

<div class="post-metadata">

**Author:** ![dhiraj.pawar](https://avatars.discourse-cdn.com/v4/letter/d/3ec8ea/32.png) [@dhiraj.pawar](https://forum.inductiveautomation.com/u/dhiraj.pawar)\
**Post date:** [May 7, 2025, 6:38am UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637/2 "2025-05-07T06:38:53Z")

</div>

Hi @mazeyrat ,  
Have you got any solution on add test in text areas at cursor positon

---

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [May 7, 2025, 7:02am UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637/3 "2025-05-07T07:02:43Z")

</div>

no, you can with vision but I did not find any solution for perspective

---

<div class="post-metadata">

**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\
**Post date:** [May 7, 2025, 1:52pm UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637/4 "2025-05-07T13:52:29Z")

</div>

You can use JavaScript injection in a hidden Markdown component with the following as its source:

```python
<img style='display: none' src='/favicon.ico' onload=" \
		const view = [...window.__client.page.views._data.values()].find(view => view.value.mountPath == this.parentNode.parentNode.parentNode.getAttributeNode('data-component-path').value.split('.')[0]).value; \
		const notesTextArea = document.getElementById('textAreaDomID'); \
		function getSelected() { \
			const selectionStart = notesTextArea.selectionStart; \
			view.custom.write('selectionStart', selectionStart); \
			const selectionEnd = notesTextArea.selectionEnd; \
			view.custom.write('selectionEnd', selectionEnd); \
		} \
		function reportSel() { \
			setCursorAt = view.custom.read('setCursorAt'); \
			if (setCursorAt > -1) { \
				notesTextArea.blur(); \
				notesTextArea.setSelectionRange(setCursorAt, setCursorAt); \
				notesTextArea.focus(); \
				getSelected(); \
				view.custom.write('setCursorAt', -1); \
			} \
			if (view.custom.read('runJS')) \
				setTimeout(() => { reportSel(); }, 100); \
		} \
		notesTextArea.onclick = getSelected; \
		notesTextArea.onkeyup = getSelected; \
		notesTextArea.oncontextmenu = getSelected; \
		notesTextArea.onmouseout = getSelected; \
		view.custom.write('runJS', true); \
		reportSel();"></img>

```

Assign "textAreaDomID" as the DOM ID, and create the custom view properties "selectionStart" and "selectionEnd" that will capture the cursor/selection location. The custom view property "runJS" is required if you want to make sure the JavaScript stops running when the view is shut down (you'll need to set it to False when that happens).

---

<div class="post-metadata">

**Author:** ![Lynn\_Martineau](https://avatars.discourse-cdn.com/v4/letter/l/f1d935/32.png) [@Lynn\_Martineau](https://forum.inductiveautomation.com/u/Lynn_Martineau)\
**Post date:** [June 10, 2026, 10:11pm UTC](https://forum.inductiveautomation.com/t/add-text-in-a-text-area-at-the-cursor-position/87637/5 "2026-06-10T22:11:18Z")

</div>

This is a bit of a hack; not nearly as good as @Ryan_Deardorff solution but it was good enough (and simple enough for my limited skills) to meet my requirement. This is in the text Change Script.

It does require the user to do some editing for the insertion point to be \> 0.

```python
	if origin in ['Browser','Script']:
		# compare previous to current and estimate the insertion point
		previousLen = len(previousValue.value)
		currentLen = len(currentValue.value)
		pos = 0
		while pos < min(previousLen, currentLen):
			if previousValue.value[pos] != currentValue.value[pos]:
				break
			pos += 1		
		self.custom.insertionPoint = pos

```

I use the custom.insertionPoint in a message script on the textArea component:

```python
myText = self.props.text
newText = payload['newText']
insertAt = self.custom.insertionPoint
self.props.text = myText[:insertAt] + newText + myText[insertAt:]

```