JavaScript Development
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
 
User Name:
Password:
Remember me
 
Go Back   Dev Articles Community Forums > Programming > JavaScript Development
Reload this Page

Automatically insert highlighted text from a textarea into a prompt box

Discuss Automatically insert highlighted text from a textarea into a prompt box in the JavaScript Development forum on Dev Articles.
Automatically insert highlighted text from a textarea into a prompt box JavaScript Development forum discussing the use of JavaScript and its features as a powerful DOM manipulator. JavaScript is used in most websites to enrich the interface and enhance the user experience.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Display Modes
 
Unread Dev Articles Community Forums Sponsor:
Stay one step ahead of the competition. Evaluate and give feedback on some of the hottest web development tools on the market today. Make your opinion heard! Click Here
  #1  
Old August 3rd, 2006, 11:41 AM
W3b D3zygn3r W3b D3zygn3r is offline
Registered User
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Posts: 8 W3b D3zygn3r User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 3 h 49 m 56 sec
Reputation Power: 0
Automatically insert highlighted text from a textarea into a prompt box
How can i get that a highlighetd text from a textarea be automatically inserted into a prompt box?

Let's use this example:

Code:
function InputText() 
  {
	var enterText = prompt("Enter the text to add", "Right here");
        var addText = "enterText";
      if (enterText=null && enterText!="")
      {
	    document.form.textarea.value=AddText;
	  } 
   }


Thanks in advance!
Reply With Quote
  #2  
Old August 3rd, 2006, 11:57 AM
Icon's Avatar
Icon Icon is offline
Command Line Warrior
Click here for more information
 
Join Date: Sep 2005
Posts: 622 Icon User rank is Private First Class (20 - 50 Reputation Level)Icon User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: 1 Week 1 Day 22 h 40 m 30 sec
Reputation Power: 3
Do you want the text from the prompt to go in the textarea or the other way around? Your description says one, your code implies the other?
Reply With Quote
  #3  
Old August 3rd, 2006, 12:12 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
event though i dont really know how we as the website, would take advantage of the users ctrl+c and ctrl+v functions

unless there is another line that is like
.selectedText
or something like that,

ill look it up because whichever way he is trying to move the text, he would have to use something like this anyway

colton22
Reply With Quote
  #4  
Old August 3rd, 2006, 12:13 PM
W3b D3zygn3r W3b D3zygn3r is offline
Registered User
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Posts: 8 W3b D3zygn3r User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 3 h 49 m 56 sec
Reputation Power: 0
Quote:
Originally Posted by Icon
Do you want the text from the prompt to go in the textarea or the other way around? Your description says one, your code implies the other?

The other way around. The code i put as an example launches the prompt box when a button is clicked for users enter the text themself but what i want now is that when a user highlights part of a text within the textarea it be automatically entered into the prompt box, i just need that function that do that work.

I hope it be clear enogh now...
Reply With Quote
  #5  
Old August 3rd, 2006, 12:20 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
i hope this may spark an idea or so...
hey i just though of something, not sure if it will work but its worth a try, its limited to IE though...

document.write("<DIV ID='pro' STYLE='display:none'><SCRIPT>function showprompt() {}</SCRIPT></DIV>");
var _text=[text];

function _updatetheprompt() {pro.innerHTML="<SCRIPT>function showprompt() {prompt("first msg",_text);}</SCRIPT>"

in the textbox, on keypress update the _text with a function

my example wont work right now but if there is a way to run with it, i could turn into what you may want. hope i helped at least a little

colton22
Reply With Quote
  #6  
Old August 3rd, 2006, 12:36 PM
W3b D3zygn3r W3b D3zygn3r is offline
Registered User
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Posts: 8 W3b D3zygn3r User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 3 h 49 m 56 sec
Reputation Power: 0
Hmmm... I don't know, my JavaScript knowledge is very limited so that's why i prefer simpler codes...(at the moment...) but thanks anyway for the imput!

BTW, i don't want the script for a web page but a forum. So what a better example of what i really want to use the script for that this very forum?!

By highlighting some text when doing a post and then click on the URL button the highlighted text will be automatically entered into the prompt box! so that's exactly what i want to do!
Reply With Quote
  #7  
Old August 3rd, 2006, 12:43 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
i c what you want...

you want to go ahead and have like a bold button and stuff and when they click on the bold button while text is selected you want to have a prompt saying "bold this text" and a default answer of what is selected right??

if so, what you could do instead is maybe just take the text that is selected and add the tags around it if text is selected, if it isnt then prompt, it saves you a step and it also saves the user a step.

then the prob is how to take the copied text and repost it back in.

well if you can find a way to get the text that is currently selected, i know the way to edit the contents and add the other text before and after it like normal....

i will post one more time with that code...

colton22
Reply With Quote
  #8  
Old August 3rd, 2006, 12:55 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
heres this...
Code:
var _boldtagclose="%5B%2FB%5D"; //[/B]
var _boldtagopen="%5BB%5D"; // [B]
//exc...

//a good website for the encodeing of characters... http://www.dragonwinds.com/resources/html-codes.shtml

function _bold(phrase) {
var origtext=window.document.form.textarea.value;
var _selectedtext=escape(phrase);
var sep=origtext.indexOf(_selectedtext);
var endsep=eval(sep+(_selectedtext.length));
var firsttext=origtext.substring(0,sep);
var ajustedtext=_boldtagopen+_selectedtext+_boldtagclo  se;
var lasttext=origtext.substring(sepend,origtext.length  );
window.document.form.textarea.value=firsttext+ajus  tedtext+lasttext;
//the unescaped code for the [=%5B       /=%2F      ]=%5D
}



ps check your messages...

colton22
Reply With Quote
  #9  
Old August 3rd, 2006, 01:03 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
Code:
function getSel()
{
	var txt = '';
	var foundIn = '';
	if (window.getSelection)
	{
		txt = window.getSelection();
		foundIn = 'window.getSelection()';
	}
	else if (document.getSelection)
	{
		txt = document.getSelection();
		foundIn = 'document.getSelection()';
	}
	else if (document.selection)
	{
		txt = document.selection.createRange().text;
		foundIn = 'document.selection.createRange()';
	}
	else return null;
	return txt;
}


if it returned null, prompt, otherwise go and do a search on the value of the textbox, if the text isnt found in the textbox, alert saying error, otherwise add the value to it, give me about 2 hours and ill be back on and ill have the complete code for you it is 202 pm here now and ill be back at about 4-5 alright?? c ya l8r

colton22
Reply With Quote
  #10  
Old August 3rd, 2006, 04:18 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
alright i got two vs. of it
the plain code you wanted is here...
Code:
function InputText() { var enterText = prompt("Enter the text to add", getSel()); var addText = "enterText"; if (enterText=null && enterText!="") { document.form.textarea.value=AddText; } }
function getSel(){
	var txt=null;
	if (window.getSelection) {txt = window.getSelection();}
	else if (document.getSelection) {txt = document.getSelection();}
	else if (document.selection) {txt = document.selection.createRange().text;}
	return txt;
}


The code i tryed to "spunk up" is here
Code:
<HTML>
<BODY>
<FORM NAME="smo">
<textarea name="mo" COLS="40" ROWS="20"></textarea>
</FORM>
<INPUT TYPE="BUTTON" VALUE="BOLD" ONCLICK="changetext(0,window.document.smo.mo)" />
<INPUT TYPE="BUTTON" VALUE="ITALISIZE" ONCLICK="changetext(1,window.document.smo.mo)" />
<INPUT TYPE="BUTTON" VALUE="LINK" ONCLICK="changetext(2,window.document.smo.mo)" />
<INPUT TYPE="BUTTON" VALUE="HILIGHT" ONCLICK="changetext(3,window.document.smo.mo)" />
<SCRIPT>
/**************************************************  *************
PERSONAL REFERENCE
INDEX   |  SUBSTITIUING
-----------------------
0       |    B - BOLD
1       |    I - ITALICS
2       |    URL - LINK
3       |    H - HILIGHTED
4       |    -
5       |    -
6       |    -
7       |    -
8       |    -
9       |    -
10      |    -

EXC... RIGHT A NOTE FOR YOURSELF ABOUT THIS...


**************************************************  *************/
//USE THIS ARRAY FOR THE SYMBOLS YOU WILL USE...
var _tags=new Array();
	_tags[0] ="B" //BOLD
	_tags[1] ="I" //ITALICS
	_tags[2] ="URL" //LINK
	_tags[3] ="H" //HILIGHTED
	_tags[4] ="" //
	_tags[5] ="" //
	_tags[6] ="" //
	_tags[7] ="" //
	_tags[8] ="" //
	_tags[9] ="" //
	_tags[10]="" //
	_tags[11]="" //
	_tags[12]="" //
	_tags[13]="" //
	_tags[14]="" //
	_tags[15]="" //
	//EXC


//TO RUN THIS FUNCTION USE THIS... changetext(0,window.document.formname.textareaname  ); this will bold because of the 0

function changetext(what2doIndex,_textarea) {
var origtext=_textarea.value;
var _selectedtext=getSel();
if (what2doIndex==2) {_link(_selectedtext,origtext,_textarea);} //LINKS
else {
if ((_selectedtext==null) || (_selectedtext=="")) { //NO TEXT SELECTED
var texttowrite=prompt("What Text?","");
var ajustedtext="%5B"+_tags[what2doIndex]+"%5D"+texttowrite+"%5B%2F"+_tags[what2doIndex]+"%5D";
_textarea.value+=unescape(ajustedtext);
}
else { //TEXT SELECTED
var sep=origtext.indexOf(_selectedtext);
var endsep=eval(sep+(_selectedtext.length));
var firsttext=origtext.substring(0,sep);
var ajustedtext="%5B"+_tags[what2doIndex]+"%5D"+_selectedtext+"%5B%2F"+_tags[what2doIndex]+"%5D";
var lasttext=origtext.substring(endsep,origtext.length  );
_textarea.value=firsttext+unescape(ajustedtext)+la  sttext;
}}}
textselected=true;
function _link(sel,orig,txtbox) {
if ((sel==null) || (sel=="")) {sel="[none]";textselected=false;}
var towhere=prompt("Where To Link To","http://");
if ((towhere==undefined) || (towhere=='undefined') || (towhere==null) || (towhere=="http://") || (towhere=="")) {}
else {
if (towhere.substring(0,7)!="http://") {towhere="http://"+towhere;}
var words=prompt("What Text Would You Like To Display?",sel);
if ((words=="") || (words=="[none]") || (words==null) ||(words==undefined) || (words=='undefined')) {
var texttowrite=towhere;
if (textselected) {
var sep=orig.indexOf(sel);
var endsep=eval(sep+(sel.length));
var firsttext=orig.substring(0,sep);
var lasttext=orig.substring(endsep,orig.length);
txtbox.value=firsttext+unescape((("%5B"+_tags[2]+"%5D"+texttowrite+"%5B%2F"+_tags[2]+"%5D")))+lasttext;
}
else {txtbox.value+=unescape((("%5B"+_tags[2]+"%5D"+texttowrite+"%5B%2F"+_tags[2]+"%5D")));}
}
else {
var texttowrite=words;
if (textselected) {
var sep=orig.indexOf(sel);
var endsep=eval(sep+(sel.length));
var firsttext=orig.substring(0,sep);
var lasttext=orig.substring(endsep,orig.length);
txtbox.value=firsttext+unescape((("%5B"+_tags[2]+"='"+towhere+"'%5D"+texttowrite+"%5B%2F"+_tags[2]+"%5D")))+lasttext;
}
else {txtbox.value+=unescape((("%5B"+_tags[2]+"='"+towhere+"'%5D"+texttowrite+"%5B%2F"+_tags[2]+"%5D")));}
}
}textselected=true;
}
function getSel(){
	var txt=null;
	if (window.getSelection) {txt = window.getSelection();}
	else if (document.getSelection) {txt = document.getSelection();}
	else if (document.selection) {txt = document.selection.createRange().text;}
	return txt;
}
</SCRIPT>
</BODY>
</HTML>


if you would please just copy my code that i created and run it as a .html file, it is very helpful, i guess i kinda went overboard though. anyquestions about my code ask.

colton22
Reply With Quote
  #11  
Old August 3rd, 2006, 04:44 PM
Kravvitz Kravvitz is offline
Contributing User
Dev Articles Newbie (0 - 499 posts)
  
Join Date: May 2005
Location: USA
Posts: 134 Kravvitz User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 23 h 38 m 30 sec
Reputation Power: 4
Reply With Quote
  #12  
Old August 3rd, 2006, 04:54 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
if you try the 2 code box, it does work to get input and textarea text...

i tried
Reply With Quote
  #13  
Old August 3rd, 2006, 05:06 PM
Kravvitz Kravvitz is offline
Contributing User
Dev Articles Newbie (0 - 499 posts)
  
Join Date: May 2005
Location: USA
Posts: 134 Kravvitz User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 23 h 38 m 30 sec
Reputation Power: 4
It works in IE but not in Firefox or Opera.
Reply With Quote
  #14  
Old August 3rd, 2006, 05:13 PM
colton22's Avatar
colton22 colton22 is offline
\ ^_^ / - Moderator
Dev Articles Newbie (0 - 499 posts)
  
Join Date: Jun 2006
Location: near chicago, Illinois
Posts: 471 colton22 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 Days 1 h 10 m 16 sec
Reputation Power: 3
Send a message via AIM to colton22 Send a message via MSN to colton22 Send a message via Yahoo to colton22
sry, your right, i was in ie, i just tried it in netscape, i guess i should research b4 opening my mouth,

sry

colton22
Reply With Quote
Reply

Viewing: Dev Articles Community Forums > Programming > JavaScript Development > Automatically insert highlighted text from a textarea into a prompt box

« Previous Thread |