Set textarea selection in Internet Explorer

Question

I'm looking for a way to set a selection in a textarea in Internet Explorer. In other browsers, this works just fine:

textarea.selectionStart = start;
textarea.selectionEnd = end;

In IE, I assume I have to use createRange and adjust the selection somehow, but I cannot figure out how.

Extra bonus points for a link to a proper documentation about createRange and associated methods, MSDN isn't helping out much.

Answer 1

This works for me:

<textarea id="lol">
noasdfkvbsdobfbgvobosdobfbgoasopdobfgbooaodfgh
</textarea>

<script>
var range = document.getElementById('lol').createTextRange();
range.collapse(true);
range.moveStart('character', 5);
range.moveEnd('character', 10);
range.select();
</script>

Useful links:

• http://help.dottoro.com/ljlwflaq.php
• http://www.webreference.com/programming/javascript/ncz/
• http://www.quirksmode.org/dom/range%5Fintro.html

moveStart() at MSDN: http://msdn.microsoft.com/en-us/library/ms536623%28VS.85%29.aspx

moveEnd() at MSDN: http://msdn.microsoft.com/en-us/library/ms536620%28VS.85%29.aspx

Answer 2

Try with

function select(e, start, end){
     e.focus();
     if(e.setSelectionRange)
        e.setSelectionRange(start, end);
     else if(e.createTextRange) {
        e = e.createTextRange();
        e.collapse(true);
        e.moveEnd('character', end);
        e.moveStart('character', start);
        e.select();
     }
}
select(document.getElementById('textarea_id'), 5, 10);

Answer 3

Beware of line separators, move* methods see them as one character, but they are actually two - \r\n