SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    E-business guru Eirik's Avatar
    Join Date
    Nov 2000
    Location
    Oslo, Norway
    Posts
    413
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Placing text at cursorpoint

    Hi guys,

    I know there are about a dozen posts similar to this one, but IŠve read them all, and none of them seem to give a straight answer.

    So, what I want to do is add text to a textarea when a button is clicked. However, I don't just want it appended at the end, but inserted at the point where the cursor/caret currently is.

    Having browsed the various posts above, IŠve put together the following:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <html>
      <head>
    	<title>Title</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
    	<script type="text/javascript">
    	  function insertText(elemID, txt)
    	  {
    		var elem = document.getElementById(elemID);
    		
       if ( typeof elem.caretPos == 'undefined' ) // Opera 7 ??
    	elem.value += txt;
       else 
    	elem.caretPos.text = elem.caretPos.text.charAt(elem.caretPos.text.length - 1) == ' ' ? txt + ' ' : txt;
      // elem.innerHTML += text;
    	  }
    	</script>
      </head><body>
      
    	<form>
    	  <textarea id="txt1" cols=20 rows=20></textarea>
    	  <input type="button" value="Insert some text" onclick="insertText('txt1', 'Hello');">
    	</form>
      </body>
    </html>
    Judging by the code (and keeping in mind that my JavaScript knowledge is limited) this should work, but it doesn't. In stead of inserting the text at cursorpoint, it appends the text at the end. What am I doing wrong? Does the textarea loose information about its caret position when I click the button?

    Thanks a whole bunch in advance !
    Sincerely,

    Eirik Johansen
    Netmaking AS

  2. #2
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You need events to constantly reset the caret, for that method.

    Rather than explain it all, I'll let you browse this

    http://www.peterbailey.net/dhtml/taeditor.htm
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  3. #3
    E-business guru Eirik's Avatar
    Join Date
    Nov 2000
    Location
    Oslo, Norway
    Posts
    413
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Beetle,

    Thanks for the suggestion. After some modifications, the script suited my simple needs.
    Sincerely,

    Eirik Johansen
    Netmaking AS

  4. #4
    SitePoint Guru Vincent Puglia's Avatar
    Join Date
    Feb 2000
    Location
    where the World once stood
    Posts
    700
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Watch it beetle, Sketch edited out the link in one of my posts for putting a link to my site. [img]images/smilies/biggrin.gif[/img]

    Vinny
    Where the World Once Stood
    the blades of grass
    cut me still


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •