Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to delete selected with a mouse text from textarea???. 1

Status
Not open for further replies.

Guest_imported

New member
Jan 1, 1970
0
Good day to all...
I have a little form and textarea on my webpage...
what I am trying to do is to track the text which user selects with his mouse...

for example... visitor selects a text from textarea and clicks on "delete" button.. RESULT IS the selected part of text gets deleted from textarea...

Thank you very much!!!
sergey@asiaintershop.com
 
Give me a better idea of what exactly your goal is.

If you would like to know what a user does while inside a textarea or input of type text you'll have to run a javascript function every time an event like a keypress is detected.

What are you trying to accomplish by knowing what the state of the textarea is while the user is still in it? Perhaps you would accept a solution of reading the textarea as soon as the user leaves that field.

Again, explain better.
 
ok....
when web page loads, there is already a text in the textarea!.... user reads this text.... I want him to be able (with his mouse) select some part of text and click on "button bold" (i make it myself) to make this part of text BOLD. :)

Then, with his mouse he selects another part of text.. and chooses UNDERLINE... selected text becomes UNDERLINED....
I am making something like HTML EDITOR...
So what basically I need to know is the method that helps me to track, which part of text user selects with his mouse.. and then edit this selected part of text with HTML tags...
Any ideas???? thank you
 
Hi,

I know that you can do document.forms[0].textarea.select(); to select the entire text of the textarea but I'm not sure that you can track a selected part. Perhaps you can do it with an event Handler ...
 
Hi Sergei!
Sorry, but it seems that you cannot do this.
I think it's impossible to track the position in text field/area where mouse is clicked and cursor is positioned.
 
:((((((((((((((((((((((((... I cannot do it with JavaScript

can you suggest me what language to use then to be able to do it?
I need to be able to track the selected text....
copy it
assign it to another variable and etc....

Thank you very much...
thank you
 
what if i use this???

document.selection.createRange().execCommand("cut");
 
YEEEEEEEEEEEEEEEES
ActiveWindow.Selection.TextRange.Copy
:))))))))))))))
 
Sergey, is it cross browser or ie only ???
a cross browser solution would be : onclick (in the text area), save the position - onmouseup right after (use a flag for the "right after"), save the position. Selected text is the text between position 1 and position 2 !!
 
But this is a very difficut example...:)))
why not use TextRange().... the code is going to execute on IE only!!! so it does not matter which prowser!!...
I hope to find an example with JavaScript... as you see I have already founf one with VBScript... I cannot believe JavaScript cannot do it.

please if you help more ideas HELP ME :)
 
i was just wondering ... if you're only targetting ie, then it's fine, use the textrange ... why would you get a headache if you already have something working anyway !!!! it CAN be done in jscript but if you got it working, fine !!!

 
hey sergey,
i'm here because i'm trying to do the exact same thing
since 11 this morning (GMT +1)
i don't know if you'll try it again with the
textrange thing like i do. it works ell so far.
i use the methods textrange and innerHTML in a div,
because i cannot use a form.

my problem is the event handler "onKeyPress":
does anybody know how to get the codes of ALL keys pressed.
for example backspace steps back to
the last document opened, but i want use it to delete a character...

 
For a solution to creating textRanges in Netscape:

Go to
Search the Javascript documentation for the getSelection method. It is actually simpler to use than the IE method.

If you have any trouble, post your code attempts here, and we will fix ;-).
 
here is a small example (tested in IE5.5) to show you how to use textranges to make some selected text bold or italics:

<script>

function makeSelectedRange()
{
return document.selection.createRange()
}

function makeBold()
{
makeSelectedRange().execCommand(&quot;Bold&quot;);
}

function makeItalics()
{
makeSelectedRange().execCommand(&quot;Italic&quot;);
}


</script>
<div>
Try selecting this text
</div>
<br><br>
<button onclick=&quot;makeBold()&quot;>Bold</button>
<button onclick=&quot;makeItalics()&quot;>Italics</button>

for more info and further reading:


Hope this helps at all... jaredn@eae.net -
 
Thanx jaredn,
this was actually helpful to me,
but I had something like this before:

<html>
<head>
<title>Dies ist kein Formular</title>
<script>
document.onkeypress = steuern;

function steuern(e){

switch(event.keyCode){
case 13 : mywrite = &quot;<br>&quot;; //13 == RETURN KEY
break;
case &quot;<&quot; : mywrite = &quot;<&quot;;
break;
case &quot;>&quot; : mywrite = &quot;>&quot;;
break;
default : mywrite = String.fromCharCode(event.keyCode);
}//switch

writeIt(mywrite);
}//of function steuern


function writeIt(mytext){
document.getElementById('tafel').innerHTML+=mytext;
}//of function writeIt

function setAttribute(what){
for (i=0; i<laenge;i++){
alert(&quot;feld &quot;+i+&quot; &quot;+zerPflueckt);
}//for

document.selection.createRange().pasteHTML(&quot;<&quot;+what+&quot;>&quot;+document.selection.createRange().text+&quot;</&quot;+what+&quot;>&quot;);
}//of function setAttribute


function fett(e){
setAttribute('b');
}//of function fett

function kursiv(e){
setAttribute('i');
}//of function kursiv

function unterStr(e){
setAttribute('u');
}//of function unterStr


</script>
</head>

<body onload=&quot;window.focus()&quot;>

<form action=&quot;&quot; method=&quot;&quot; name=&quot;formatText&quot;>
<input type=&quot;Button&quot; value=&quot;FETT&quot; onclick=&quot;fett()&quot;>
<input type=&quot;Button&quot; value=&quot;Kursiv&quot; onclick=&quot;kursiv()&quot;>
<input type=&quot;Button&quot; value=&quot;Unterstrichen&quot; onclick=&quot;unterStr()&quot;>
</form>
<div id=&quot;tafel&quot;>
Write here:<br>

</div>

</body>
</html>


My Problem is the switch I used there:
I can get the code of the return-key (13)
and of all charcters,
but important things like &quot;backspace&quot;
and don't work,
also I havn't seen a &quot;<&quot; so far in my document.
IE interprets backspace, before I get it into my eventhandler - function.
By the way:
I'm sorry for the german names of the variables and functions:
it's a bad habit. ;-)

Regards,

Buraje
 
YEEEEEEEEEEEEEEEEEEEEEEES. !!!!!!!!!! :))))))))
that work.... :) but there is one little problem....
what is I want to make one part of text bold, another italic and then view a source code of it... there is no <b> or <i> tag.... what if I want to change the font :) to make it verdana for example :)))).... is this is possible then JAVASCRIPT is THE POWER :)
and I cannot hold myself from saying it
this forum is COOOOOOOOOOOOOOOOOL...

thank you very much!
Sergey
 
Hello,
Can anyone suggest me a sample code or provide me with a sample of hoe to do it in NetsacpeNavigator
Thanks in advance,
Raman
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top