Javascript:  Help needed to modify a script -- trying to insert a "special character" into a text field at the point where cursor

Posted on 2008-11-19
Last Modified: 2012-05-05
Hello experts.  I have a text area which a user can modify.  I need them to be able to insert a symbol into the text area (which they can).  However the symbol is always inserted at the end of the text (see code snippet below).  I need the symbol to be inserted at the point where the cursor is when the user inserts (so in the snippet below, i want a TM symbol inserted where the ">>>" are and not after the word "always" at the end.

Is this possible?

Thank you so much.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="">


<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Experts Sample</title>

<script type="text/javascript">

function addText_myText(text){

  document.getElementById('myText').value += text;





<form action="" method="post" name="Bioform" id="Bioform">

<a href="#" onClick="addText_myText('&#174;');updatetext('myText','repmyText_tab1','htext');" myText="Insert &#174; symbol">&#174;</a> <a href="#" onClick="addText_myText('&#8482;');updatetext('myText','repmyText_tab1','htext');" myText="Insert &#8482; symbol">&#8482;</a><br>

<textarea cols="30" rows="10" name="myText" id="myText" onKeyDown="updatetext('myText');" onKeyUp="updatetext('myText');">This is a long paragraph.  I'd like to insert a trademark symbol here >>>.  However it will always insert at the end of this text.  Can this script be modified to insert symbol where cursor is placed?  Thank you as always.</textarea>




Open in new window

Question by:whaleyk
    LVL 15

    Accepted Solution

    Try the below i made for another question on here:

    This will insert the TM or what ever symbol you pass in where the cursor is. You can also highligh text and it will append the symbol to the end of it.
    <script type="text/javascript">
            function setColor(a) {
                    var seltxt=''
                    var textbox = document.getElementById('inputforum');                    
                    if (document.selection) { // for IE                     
                            var sel = document.selection.createRange();
                            sel.text = sel.text + a;
                    } else if (typeof textbox.selectionStart != 'undefined') { // for FF, Opera etc...
                            var len = textbox.value.length;
                            var start = textbox.selectionStart;
                            var end = textbox.selectionEnd;
                            var sel = textbox.value.substring(start, end);
                            var replace = sel + a;
                            textbox.value = textbox.value.substring(0,start) + replace + textbox.value.substring(end,len);
    <textarea id="inputforum"></textarea>
    <input type="button" onclick="setColor('&#174;')" value="Insert TM" />

    Open in new window


    Author Closing Comment

    That's beatufiul :-)  Thank you very much.

    Featured Post

    Course: HTML5 Specialist

    HTML5 development skills are critical to all developers. HTML5 is the foundation to almost any development process. That's why business, design studios, development shops and other organizations need HTML5 developers. Get your foot in the door as a HTML5 specialist.

    Join & Write a Comment

    When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (, typical array handling might look like this: (CODE) B…
    JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    16 Experts available now in Live!

    Get 1:1 Help Now