Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Mar 2004
    Location
    Sydney Australia
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts

    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------------------------------------
    Last edited by liorean; 06-11-2004 at 12:26 PM. Reason: [code]
    wind is your friend

  • #2
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,461
    Thanks
    1
    Thanked 23 Times in 21 Posts
    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


  •  

    Posting Permissions

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