Jump to content


This topic is now archived and is closed to further replies.


Change Form Value By Focus

Recommended Posts

Right, I am making a PM system, when sending a message users can click on an emoticon and have the emoticon code inserted in the message box

That works fine, see below for the code im currently using

[code]<a OnClick="document.form.message.value = document.form.message.value + ' :boxing: '";><img src=default/boxing.gif border=0></a>[/code]

However, On clicking the emotion image the code is being inserted at the end of the text in the message box

This still works, but, if someone has typed 3 lines out and decides the want an emoticon on line 2, on clicking the emoticon it is inserted at the end (line 3)

How can I get it to insert the emoticon code where the focus of the cursor is currently at?


Share this post

Link to post
Share on other sites
There are multiple threads on these boards that discuss how to find the currrent caret position... search for them.

Share this post

Link to post
Share on other sites
I dont know what to search for though

Caret postion?

I searched for that and it gave no matches

Share this post

Link to post
Share on other sites
I don't know either... something with TEXTAREAs and cursor positions, I think.  If I can find the thread(s) again, I'll provide you with the link.

Share this post

Link to post
Share on other sites
Ive found this code but im unsure how to use it, im not too good with javascript, this is above my level

[code]function insertAtCursor(myField, myValue) {
//IE support
if (document.selection) {
sel = document.selection.createRange();
sel.text = myValue;
else if (myField.selectionStart || myField.selectionStart == ‘0′) {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)
+ myValue
+ myField.value.substring(endPos, myField.value.length);
} else {
myField.value += myValue;
// calling the function
insertAtCursor(document.formName.fieldName, ‘this value’);[/code]

I assume I would call it like this

[b]OnClick="insertAtCursor(myField, myValue)"[/b]

What should MyField and myValue be?

Also, do i need to change the properties of this line

[b]// calling the function
insertAtCursor(document.formName.fieldName, ‘this value’);[/b]

fornName = manually enter the name of my form etc?

Share this post

Link to post
Share on other sites
This works in IE perfect, but in firefox, it inserts the value at the begining of the text area, god knows why. Anyway, here is the code, any ideas why?

Or perhaps another script I can use?

This works :)

[code] <script LANGUAGE=\"Javascript\">
var globalCursorPos; // global variabe to keep track of where the cursor was

function setCursorPos() {
  globalCursorPos = getCursorPos(form.message);

function getCursorPos(textElement) {
  var sOldText = textElement.value;

  var objRange = document.selection.createRange();
  var sOldRange = objRange.text;

var sWeirdString = '#%~';

  objRange.text = sOldRange + sWeirdString; objRange.moveStart('character', (0 - sOldRange.length - sWeirdString.length));

var sNewText = textElement.value;

  objRange.text = sOldRange;

  for (i=0; i <= sNewText.length; i++) {
    var sTemp = sNewText.substring(i, i + sWeirdString.length);
    if (sTemp == sWeirdString) {
    var cursorPos = (i - sOldRange.length);
      return cursorPos;

function insertString(stringToInsert) {
  var firstPart = form.message.value.substring(0, globalCursorPos);
  var secondPart = form.message.value.substring(globalCursorPos, form.message.value.length);
form.message.value = firstPart + stringToInsert + secondPart;


Share this post

Link to post
Share on other sites
Like I said, I'm not familiar with these scripts, so I can't really help much... I don't know the intricacies of how FF handles this.

Share this post

Link to post
Share on other sites


Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.