Topic awaiting preservation: Cursor Position in form field (Page 1 of 1)

Alright party people here's the setup

In my weblog I want to make a nice little way to add links to a post. So I've written a nice little script that popups up a window with 2 fields, one with the link url and the other with the text and then populates the original form field with a nice little link

This is no problem. What I would like to do is be able to track where in the form field the cursor position is so that when someone is editing text, and then clicks on the "Insert Link" button I can place the link at the cursor position. (Right now it puts the link at the end of whatever is in the field)

I'm thinking I can grab the position of the text by using the onBlur handler on the form field but I don't know what values I'm supposed to grab.

Any ideas?



.:[ Never resist a perfect moment ]:.

bd: Its a tricky one - we discussed this at the GN in relation to the way the script works there (however, things are a little screwy as it was done when we were using UBB - I'll clean it up):
http://development.gurusnetwork.com/discussion/thread/651/

___________________
Emps

FAQs: Emperor

hmm I think this bit:

if (textEl.createTextRange && textEl.caretPos) {

var caretPos = textEl.caretPos;

caretPos.text =

caretPos.text.charAt(caretPos.text.length - 1) == ' ' ?

text + ' ' : text;

is the bit I need (The other bit is virtually what I have now). Gotta go I'll give it a try later.



.:[ Never resist a perfect moment ]:.

I remember messing with this at some point, but no one seemed to be able to make it work unless you had something selected.

The poster has demanded we remove all his contributions, less he takes legal action.
We have done so.
Now Tyberius Prime expects him to start complaining that we removed his 'free speech' since this message will replace all of his posts, past and future.
Don't follow his example - seek real life help first.

it's in there --> http://www.faqts.com/knowledge_base/index.phtml/fid/130

Cool got it working.

I'm using a bit of my own stuff with what mas had posted (which looks like the same stuff that Emp's used at the GN)

This is what I have on the page with the form
<script>
function popup(url, height, width) {
height = (height) ? height : 480;
width = (width) ? width : 640;
win = window.open(url,"mywin","width="+width+",height="+height+",scrollbars=1");
}

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

function storeForm(textEl) {
document.currentForm = textEl;
}

</script>
------------------------------------------------------------------------------
Then my textarea elements look like this
<textarea rows="10" cols="72" name="p_small_body" wrap="virtual"
onSelect="storeCaret(this);"
onClick="storeCaret(this);"
onKeyup="storeCaret(this);"
onFocus="storeForm(this)"
>

-------------------------------------------------------------------------
Then I have a link that pops up a small window that has this.

function create_link(form) {
field = window.opener.document.currentForm
if (field) {
link = "<a href=\""+form.url.value+"\">" +form.text.value+ "</a>";

if (field.createTextRange && field.caretPos) {
var caretPos = field.caretPos;
caretPos.text = (caretPos.text.charAt(caretPos.text.length - 1) == ' ') ? link + ' ' : link;
}
else {
currentstuff = field.value;
field.value = currentstuff + "<a href=\""+form.url.value+"\">" +form.text.value+ "</a>";
}
}
field.focus();
window.close();
}

And a small form with this in the form field onSubmit="create_link(this)"
it works like a charm in IE and degrades nicely (puts the link at the end of the text) in moz

Thanks for your help



.:[ Never resist a perfect moment ]:.

Started FAQ on this:

:FAQ:

___________________
Emps

FAQs: Emperor