0
<script>
function addText(event){
document.getElementById("insertid").value +=
(event.srcElement || event.target).firstChild.nodeValue.toString();
}
</script>
<textarea id="inserid"></textarea>
<table onclick=addText(event)><tr><td>[bbcode][/bbcode]</td><td>[bbcode2][/bbcode2]</td></tr></table>

problem is whe i click on the bbcode or bbcode2 it inserts it at the end of whatever is in the textarea. im looking to insert it into where the user clicks(where the carat is)
like if a user entered in the textearea:

hey whats up

and the carrot was after hey then when they click the bbcode it enteres it as

hey[bbcode][/bbcode] whats up

how do i do that?

Edited by SKANK!!!!!: n/a

3
Contributors
10
Replies
12
Views
7 Years
Discussion Span
Last Post by lifeh2o
0

This is because you are appending the new value always. You have to get the position of the carrot and do some string operation. here is a function to insert in between:-
(http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript)

function insertAtCursor(myField, myValue) {

  //IE support

  if (document.selection) {

    myField.focus();

    sel = document.selection.createRange();

    sel.text = myValue;

  }

  //MOZILLA/NETSCAPE support

  else if (myField.selectionStart || myField.selectionStart == '0') {

    var startPos = myField.selectionStart;

    var endPos = myField.selectionEnd;

    myField.value = myField.value.substring(0, startPos)

                  + myValue

                  + myField.value.substring(endPos, myField.value.length);

  } else {

    myField.value += myValue;

  }

}

// calling the function

insertAtCursor(document.formName.fieldName, 'this value');
0

oh ok i understand ehoug to apply the function code to the page above the function gets called but where in my script exactly do i make sure i call the functionald?

0

here:

<script>
function addText(event){
//document.getElementById("insertid").value +=
//(event.srcElement || event.target).firstChild.nodeValue.toString();
insertAtCursor(document.getElementById("insertid"), (event.srcElement || event.target).firstChild.nodeValue.toString())
}
</script>
<textarea id="inserid"></textarea>
<table onclick=addText(event)><tr><td>[bbcode][/bbcode]</td><td>[bbcode2][/bbcode2]</td></tr></table>
0

here:

<script>
function addText(event){
//document.getElementById("insertid").value +=
//(event.srcElement || event.target).firstChild.nodeValue.toString();
insertAtCursor(document.getElementById("insertid"), (event.srcElement || event.target).firstChild.nodeValue.toString())
}
</script>
<textarea id="inserid"></textarea>
<table onclick=addText(event)><tr><td>[bbcode][/bbcode]</td><td>[bbcode2][/bbcode2]</td></tr></table>
<script>
function addText(event){
//document.getElementById("insertid").value +=
//(event.srcElement || event.target).firstChild.nodeValue.toString();
insertAtCursor(document.getElementById("insertid"), (event.srcElement || event.target).firstChild.nodeValue.toString())
}
</script>
<textarea id="insertid"></textarea>
<table onclick=addText(event)><tr><td>[bbcode][/bbcode]</td><td>[bbcode2][/bbcode2]</td></tr></table>

doesnt work for some reason. i dont know why.

0

how am i supposed to call it? on hover or something?
well i treid

onclick="addText()" and it still didnt work

Edited by SKANK!!!!!: n/a

0
<table id='my_table'><tr><td>[bbcode][/bbcode]</td><td>[bbcode2][/bbcode2]</td></tr></table>

Now on body on load bind the 'onclick' event this way

The body html:

<script>
function init() {
    var table = document.getElementById('my_table');
    if(table) {
        table.onclick = function(e) {
            // Now call your addText function
            addText(e);
        }
    }
}
</script>
<body onload='init();'></body>

Hope you got all that.

Note there are better way to bind events please have a look at 'addEventListener()' javascript function

0

still does not even insert [bbcode][bbcode] into textarea, much less where the carot is

0

Thanks it works
But if some text is selected it get replaced
After insertion cursor moves to the end
How to make cursor remain between the inserted tag like this

[bbcode]cursore should remain here[/bbcode]

Edited by lifeh2o: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.