SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    making cursor position to new line in textarea using ctrl+enter in IE

    upto this i had done by adding "\n" .... but the cursor position is not going to next line(until any key is pressed)
    sample code:
    <html>
    <head>

    </head>
    <body>
    <textarea id="cF" name="cF" spellcheck="false" onKeyDown="return cellFieldKeyDown(event)" onKeyPress="return cellFieldKeyPress(event)" ></textarea>
    </body>
    <script>
    var cellField = document.getElementById("cF");
    function cellFieldKeyDown(ev){
    return;
    }
    function cellFieldKeyPress(ev){
    //for to stop in enter event
    if(ev.keyCode==13){
    return false;
    }
    //for to make in ctrl+enter event
    if(ev.ctrlKey&&ev.keyCode==10){
    cellField.value = cellField.value +"\n";
    }
    return true ;
    }
    </script>
    </html>

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    The keyCode doesn't change outside of IE, it's 13 whether ctrl is pressed or not.

    Try this

    Code JavaScript:
    var cellField = document.getElementById("cF");
    function cellFieldKeyDown(ev){
    return;
    }
    function cellFieldKeyPress(ev){
    //for to stop in enter event
    if(!ev.ctrlKey && ev.keyCode==13){
    return false;
    }
    //for to make in ctrl+enter event
    if(ev.ctrlKey && (ev.keyCode==13 || ev.keyCode==10)) {
    cellField.value = cellField.value +"\n";
    }
    return true ;
    }

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    As far as the cursor position goes, you can select the end of the text using a special function.

    Code JavaScript:
    function setSelRange(inputEl, selStart, selEnd) { 
     if (inputEl.setSelectionRange) { 
      inputEl.focus(); 
      inputEl.setSelectionRange(selStart, selEnd); 
     } else if (inputEl.createTextRange) { 
      var range = inputEl.createTextRange(); 
      range.collapse(true); 
      range.moveEnd('character', selEnd); 
      range.moveStart('character', selStart); 
      range.select(); 
     } 
    }

    Place the following after the newline statement.

    Code JavaScript:
    setSelRange(cellField, cellField.value.length, cellField.value.length);

    You end up with the following, which works on both IE and other browsers.

    Code JavaScript:
    function setSelRange(inputEl, selStart, selEnd) { 
     if (inputEl.setSelectionRange) { 
      inputEl.focus(); 
      inputEl.setSelectionRange(selStart, selEnd); 
     } else if (inputEl.createTextRange) { 
      var range = inputEl.createTextRange(); 
      range.collapse(true); 
      range.moveEnd('character', selEnd); 
      range.moveStart('character', selStart); 
      range.select(); 
     } 
    }
    var cellField = document.getElementById("cF");
    function cellFieldKeyDown(ev){
     return;
    }
    function cellFieldKeyPress(ev){
     //for to stop in enter event
     if(!ev.ctrlKey && ev.keyCode==13){
      return false;
     }
     //for to make in ctrl+enter event
     if(ev.ctrlKey && (ev.keyCode==13 || ev.keyCode==10)) {
      cellField.value = cellField.value +"\n";
      setSelRange(cellField, cellField.value.length, cellField.value.length);
     }
     return true ;
    }

  4. #4
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    thanks

    thanks pmd57,
    i would really say thanks to you ......
    thank you very much....
    regards
    kirubha....


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
  •