Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 06-11-2004, 05:59 AM   PM User | #1
mat41
New Coder

 
Join Date: Mar 2004
Location: Sydney Australia
Posts: 21
Thanks: 0
Thanked 0 Times in 0 Posts
mat41 is an unknown quantity at this point
detecting char position inside textArea

Hello, I need help with the following function Please:

Code:
function saveCaret(elem)
{
   if( elem.isTextEdit )
   { 
      elem.caretPos = document.selection.createRange();
   }
}

var selectionStartChar
function getCaretPos(elem)
{
  if ( elem.isTextEdit && elem.caretPos )
  {
    var orig = elem.value;
 alert (orig);
 var bookmark = "~";
 var caretPos = elem.caretPos;
    caretPos.text = bookmark;
    selectionStartChar = elem.value.search( bookmark );
    window.status = "Caret is at character " + selectionStartChar;
 //window.document.writeln ("Caret is at character " + selectionStartChar); 
 alert ("Users selection starts at char " + selectionStartChar + " (this is the selection we want to move)" );
    elem.value = orig;
  }
  
}


it gets called:

<textarea name="ta1" rows="13" cols="60" onSelect="saveCaret(this);">

<input name="btn" type="button" onclick="getCaretPos(ta1)" value="Move Selected Text">



What I am trying to achieve is to hold the 'selected value' at the same time as detecting the char position of the strat of the user selection. By the time it gets into the second function, to the line: alert (orig); my selection has been lost - I still get the char position I am looking for

Thank you in advance

Here is the complete cut n paste code .html. I have achieved some usefull functionality, please copy n run the page. My objective: there are two text areas. Each area has section headers EG:Issues (it will become clear if you run the page) what I am trying to do is: A user selects some text form a section, when they press the move text button, the text will be copied into the same section in the above textarea, (please dont let the length of the code put you off running it, i am not a js techo - i'm sure a techo will spot my error easily - alerts walk you thru what I have working, 95% is working!!) Here is what I have working. OnSelect of the second text area a function runs to createRange. Then on click of the moveText button four function run to detect the char positions of the sections, the first char of the user selected text string and what section it came from. When the last function runs to move the text - All of it moves, please help me - it would be hugely appreciated.

--------Thanking you in advance------------------start **** n paste code---------

Code:
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
//make array global arrays so the elements maybe used in other functions
var myLabelsArray = new Array("EVENTS:","ISSUES:","VISITS:","REPUTATION:","MINISTERIALS:","PERSONNAL:","ACHIEVEMENTS:");
var myCharPositions = new Array(6);

//first function called:get position of section values (Events etc..) values
function getPosOfStringValues(elem)
{
   var result;
   var i = 0;
   while (i <= 6) 
   {                        
      result = elem.value.search(myLabelsArray[i]);
   myCharPositions[i] = result;
   alert (myLabelsArray[i] + " is at character " + myCharPositions[i])
   i++;                
   }
}

//second function called, run on select of textarea:create range for position 
function saveCaret(elem)
{
   if( elem.isTextEdit )
   { 
      elem.caretPos = document.selection.createRange();
   }
}

//third function called:get char position for first char of selection 
var selectionStartChar
function getCaretPos(elem)
{
  if ( elem.isTextEdit && elem.caretPos )
  {
    var bookmark = "~";
    var orig = elem.value;
    var caretPos = elem.caretPos;
    caretPos.text = bookmark;
    selectionStartChar = elem.value.search( bookmark );
    window.status = "Caret is at character " + selectionStartChar;
 //window.document.writeln ("Caret is at character " + selectionStartChar); 
 alert ("Users selection starts at char " + selectionStartChar + " (this is the selection we want to move)" );
    elem.value = orig;
  }
  
}

//fourth function called: selectionStartChar = char pos of selection
function whereIsSelection()
{
   if((selectionStartChar > myCharPositions[0]) && (selectionStartChar < myCharPositions[1]))
   {
      alert ("came from the section:" + myLabelsArray[0] + " needs to be copied into the same section in the above text area");
   }
   if((selectionStartChar > myCharPositions[1]) && (selectionStartChar < myCharPositions[2]))
   {
      alert ("came from the section:" + myLabelsArray[1] + " needs to be copied into the same section in the above text area");
   }
   if((selectionStartChar > myCharPositions[2]) && (selectionStartChar < myCharPositions[3]))
   {
     alert ("came from the section:" + myLabelsArray[2] + " needs to be copied into the same section in the above text area");
   }
   if((selectionStartChar > myCharPositions[3]) && (selectionStartChar < myCharPositions[4]))
   {
      alert ("came from the section:" + myLabelsArray[3] + " needs to be copied into the same section in the above text area");
   }
   if((selectionStartChar > myCharPositions[4]) && (selectionStartChar < myCharPositions[5]))
   {
      alert ("came from the section:" + myLabelsArray[4] + " needs to be copied into the same section in the above text area");
   }
   if((selectionStartChar > myCharPositions[5]) && (selectionStartChar < myCharPositions[6]))
   {
      alert ("came from the section:" + myLabelsArray[5] + " needs to be copied into the same section in the above text area");
   }
   if(selectionStartChar > myCharPositions[6])
   {
      alert ("came from the section:" + myLabelsArray[6] + " needs to be copied into the same section in the above text area");
   }
}

//fifth and final function called
//code to swap selected text from textArea to textArea
var copyStr;
var lbr;
function moveSelection(where)
{
   lbr='';
   if (document.selection)
   {
      tmp=where.value;
   alert (tmp);
      sel = document.selection.createRange();
      copyStr=sel.text;
      document.selection.clear();
      tmpx=where.value.replace(/\r\n/g,' ');
      tmpy=tmp.replace(/\r\n/g,' ');
      tmpz=tmpy.length-tmpx.length-copyStr.length;
      for (var i=0;i<tmpz;i++)
   {
         lbr+='\r\n';
      }
   }
   else if (where.selectionStart || where.selectionStart == '0')  
   {
      var begin = where.selectionStart;
      var end = where.selectionEnd;
      copyStr=where.value.substring(begin,end);
      where.value=where.value.substring(0,begin)+where.value.substring(end,where.value.length)
   }
   if(copyStr=="")
   {
      alert('No text selected to be moved!')
   }
   else
   {
      document.forms[0].briefString.value+=copyStr+lbr;
   }
}


/*
//used for testing mt two global Arrays
//(array) myLabelsArray =   actual section labels 
//(array) myCharPositions = char locations of sections in forwarded brief(s)
//(var) selectionStartChar = char position at start of users selection (to move)
function testValues()
{
   var i = 0
   while (i <= 6)
   {
      alert (myLabelsArray[i] + " is at character " + myCharPositions[i])
      i++;
   }
}
*/
//-->
</script>
</head>
<body>
<form>
<textarea name="briefString" rows="13" cols="60">EVENTS:

ISSUES:

VISITS:

REPUTATION:

MINISTERIALS:

PERSONNAL:

ACHIEVEMENTS:</textarea>
<br><br>
<textarea name="ta1" rows="13" cols="60" onSelect="saveCaret(this);">
EVENTS:
eeeee eeeee eeeeee eeeeee
ISSUES:
iiiii iiiii iiiii iiiiii
VISITS:
vvvvv vvvvv vvvvv vvvvv
REPUTATION:
rrrrr rrrrrr rrrrr rrrrrr
MINISTERIALS:
mmmmm mmmmm mmmmm mmmmm
PERSONNAL:
ppppp ppppp ppppp ppppp
ACHIEVEMENTS:
aaaaa aaaaa aaaaa aaaaa
</textarea><br><br>
<input name="btn" type="button" onclick="getPosOfStringValues(ta1),getCaretPos(ta1),whereIsSelection(),moveSelection(this.form.ta1);" value="Move Selected Text">
<br><br>


</form>


</body>
</html>
-----------------------------finish------------------------------------
__________________
wind is your friend

Last edited by liorean; 06-11-2004 at 11:26 AM.. Reason: [code]
mat41 is offline   Reply With Quote
Old 06-11-2004, 10:38 PM   PM User | #2
Alex Vincent
Moderator


 
Join Date: May 2002
Location: Hayward, CA
Posts: 1,428
Thanks: 1
Thanked 19 Times in 17 Posts
Alex Vincent is on a distinguished road
This thread doesn't belong in the Post a JavaScript forum. Could one of the moderators move it, please?

FYI, Mozilla does support selectionStart and selectionEnd(?) properties for HTML textareas. See bug 58850 @ bugzilla.mozilla.org for details.
__________________
"The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
June 30, 2001
author, Verbosio prototype XML Editor
author, JavaScript Developer's Dictionary
https://alexvincent.us/blog
Alex Vincent is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 01:54 PM.


Advertisement
Log in to turn off these ads.