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!

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

Textarea cursor position 1

Status
Not open for further replies.
piejump

piejump

Programmer
Joined
Nov 22, 2001
Messages
3
Location
GB
Good afternoon,
first time using this website so please allow some slack if I come accross to forward/stupid!

Ok, i've been migrating certain scripts into a functional textarea edit box. The script runs on a messageboard service where they have special charictures which represent differnt html code (for instance b[]b replaces <b></b>) Much the same as this board!

What i've done is create some javascript (with appropriate buttons calling the function) to insert these codes. However what I ideally want as well, is if somebody select some text in the textarea and clicks the button is to surround the selected text with the special charictures.

The code which i've got is below:

Code: 
<SCRIPT language=JavaScript>
function insert(codeToInsert) 
	{
	sCbCode= codeToInsert;
	insertAtCaret (document.postform.message, sCbCode, 2)
	}

function storeCaret(objtextarea)
	{
	if (objtextarea.createTextRange) 
		{
		objtextarea.caretPos = document.selection.createRange().duplicate();
		}
	}

function insertAtCaret(objtextarea, stext,nplacement)
	{
	if (objtextarea.createTextRange && objtextarea.caretPos)
		{
		var caretPos = objtextarea.caretPos;
		caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? stext + ' ' : stext;
		}
	else {
	objtextarea.value = stext;
	}
	objtextarea.focus();
	}
</SCRIPT>

<table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot;>
<tr>
	<td>
	<a href=&quot;#&quot; onClick=&quot;insert('b[ ]b')&quot;>Bold</a> |
	<a href=&quot;#&quot; onClick=&quot;insert('i[ ]i')&quot;>Italics</a> |
	<a href=&quot;#&quot; onClick=&quot;insert('u[ ]u')&quot;>Underline</a> |
	<a href=&quot;#&quot; onClick=&quot;insert('+[ ]+')&quot;>Bullet Points</a> |
	<a href=&quot;#&quot; onClick=&quot;insert('q[ ]q')&quot;>Quoted Text</a> |
	<a href=&quot;#&quot; onClick=&quot;insert('img[ ]img')&quot;>Insert an image</a>
	</td>
</table>
<form name=postform>
	<textarea name=&quot;message&quot; cols=40 rows=5 class=&quot;input&quot; ONSELECT=&quot;storeCaret(this);&quot; ONCLICK=&quot;storeCaret(this);&quot; ONKEYUP=&quot;storeCaret(this);&quot; >
</form>
 
Sort by date Sort by votes
hi
excuse me for not taking a look on your code suggesting myne, but may be you'd find something in it usefull?

Code: 
<html><head><title>generate your post :)</title>
<script language=&quot;JavaScript&quot; type=&quot;text/javascript&quot;>
<!--
var IE=document.all || document.getElementById
var NC=document.layers

function Inserty(){
var prestart, preend, start, end, sel, range, thetext, dvsn, colname, theform, formname, colselname, colsel, effselname, effsel, effname, eff
formname=&quot;myne&quot;
colselname=&quot;colorName&quot;
effselname=&quot;effectName&quot;
theform=document.forms[formname]
colsel=theform[colselname]
effsel=theform[effselname]
colname=colsel.options[colsel.selectedIndex].value
effname=effsel.options[effsel.selectedIndex].text
eff=effsel.options[effsel.selectedIndex].value

dvsn=[&quot;[&quot;,&quot;]&quot;,&quot;[/&quot;]
prestart=&quot;&quot;
preend=&quot;&quot;

if (colname!='none'){
prestart=dvsn[0]+'color '+colname+dvsn[1]
preend=dvsn[2]+'color'+dvsn[1]
}

start=(effname!='color')?prestart+dvsn[0]+eff+dvsn[1]:prestart
end=(effname!='color')?dvsn[2]+eff+dvsn[1]+preend:preend

sel=(IE)?document.selection:(NC)?document.getSelection():null
range=sel.createRange()
thetext=range.text
if (thetext.length){
range.text=start+thetext+end
}}
//-->
</script>
</head>

<body>
<form name=myne>
<textarea name=&quot;txtar&quot;  cols=60 rows=14 wrap=virtual>
</textarea><br>
<input type=&quot;button&quot; name=&quot;b1&quot; value=&quot;effect&quot; onclick=&quot;Inserty()&quot;>
<select name=&quot;effectName&quot;>
<option value='b' selected>bold
<option value='i'>italics
<option value='u'>underline
<option value='s'>strike through
<option value='color'>color
</select>
<select name=&quot;colorName&quot;>
<option value='none' selected>None
<option value='green'>Green
<option value='red'>Red
<option value='grey'>Grey
<option value='blue'>Blue
</select>
</form>
</body>
</html>
 Victor
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

JScannell
  • Locked
  • Question Question
Programmatically inserting a newline in a &lt;textarea&gt;, &lt;span&gt;, or &lt;div&gt;
Replies
5
Views
2K
ggriffit
ggriffit
javierdlm001
  • Locked
  • Question Question
How to format text in a Textarea?
Replies
17
Views
933
javierdlm001
javierdlm001
TrinityD
  • Locked
  • Question Question
If selected, check textarea contents for string
Replies
4
Views
374
vacunita
vacunita
pdbowling
  • Locked
  • Question Question
Variable disappears when cursor closes
Replies
6
Views
323
pdbowling
pdbowling
mptwoadmin
  • Locked
  • Helpful tip Helpful tip
Saving scroll bar position-How to mod script
Replies
2
Views
209
mptwoadmin
mptwoadmin

Part and Inventory Search

Sponsor

Back
Top