processing user-selected text...??????

[ASAAKI]

i'm trying to use js to get the windows effect of processing user-selected text in a textarea. what i mean is, if the user highlights any portion of text in a textarea, and clicks on a button, then that selected text should change -- turn bold, or change color or font-size or something. just that selected text.
any ideas?

[Bosko]

You can use contenteditable in Mozilla too,if you press Ctrl+b the selected text becomes bold and if you press Ctrl+i the selected text becomes italic:

http://www.xopus.org/index.jsp?menu=mozce

[ASAAKI]

okay ,but can user selected text at least be stored in a variable?
I know there's a 'createTextRange(..)' function, is there any way to grab the value of an existing text range? The text needs to be in a form element.
thanx

[ASAAKI]

what about a createTextRange()-type solution to grab the selected text value?

this is what i need to do.
let's say there's a textarea 'textarea1' , in which the user has typed "Hey there my name is yada yada yada".
supposing the user has selected the word 'my' and clicked a button, i want to have the value of 'textarea1' broken up into three variables, txt1, txt2 and txt3.
- txt1 holds the value of the textarea before the selected text ('my').
- txt2 is the selected text itself
- text3 is all the text after the word 'my'.
after that i'll manipulate the values so that the textarea will hold the user values plus my own stuff.

how'll the script go?

[jkd]

You can grab the selection text in Mozilla through window.getSelection()

If you know about DOM2 Ranges, you can get the selection text as a Range via:

window.getSelection().getRangeAt(0);

[ASAAKI]

i tried but couldn't figure out the syntax. i tried lots of stuff, including:
var el=document.getElementById('textarea1');
var therange=document.createTextRange(window.getSelection().getRangeAt(el));

and

var therange=window.getSelection().getRangeAt(el);

how do u use window.getSelection().getRangeAt()?

[jkd]

In recent builds of Mozilla, to divide the textarea value into the 3 values as you defined:

var beforeSelection = refToTextArea.value.substring(0, refToTextArea.selectionStart);
var selectedText = refToTextArea.value.substring(refToTextArea.selectionStart, refToTextArea.selectionEnd);
var afterSelection = refToTextArea.value.substring(refToTextArea.selectionEnd);

Someone familiar with the TextRange object in IE should be able to post something equivalent for IE...