Emoticons in a Form Field

[dedwards]

I need to get a script to graphically add emoticons into a form field. I am using an Apeboard plus, a cgi script that allows one to make one's own BBS/Guestbook, etc... IS there a script out there that can do this?

[Twey]

Do you mean you just need pictures that can be clicked to insert text (as seen on this forum) or that you actually need to insert the resulting pictures?

[dedwards]

Well I have my own pictures that I want to be used where you click on them and they insert text like in the forum. That's what I was trying to do. i looked at the scripts of some forum sites like this but it seems i'm missing something and I don't really know what. I was wondering if there was a script out there with instructions for everyone to use or if someone knew how to. But yeah thats the basic idea.

[Twey]

See this.

[dedwards]

Am I supposed to be looking at the content of the page or the page source?

[Twey]

Content of the page: it includes example code.

[dedwards]

Sorry. I'm kind of confused, this code seems to have to do with inserting text where one inserts the cursor. Am I missing something here?

[Twey]

That's the point. All you need to do is call that code onclick. For example:

<img src="smiley.png" onclick="insertSmiley(':)');" />
<script type="text/javascript">
insertSmiley = function(s) {
  with(document.getElementById("myTextboxId")) {
    if (document.selection) {
      this.focus();
      sel = document.selection.createRange();
      sel.text = s;
    } else if (this.selectionStart || this.selectionStart == 0) {
      var startPos = this.selectionStart,
      endPos = this.selectionEnd;
      this.value = this.value.substring(0, startPos) + s + this.value.substr
ing(endPos, this.value.length);
      if(this.endPos != this.startPos) {
        this.selectionStart = startPos;
        this.selectionEnd = endPos;
      } else {
        this.selectionStart = startPos + s.length;
        this.selectionEnd = endPos + s.length;
      }
    } else {
      this.value += s;
    }
  }
}
</script>

[dedwards]

Oh. That makes sense... Here, I will try it.

[dedwards]

To specify where you want that text inserted, do change this line:
with(document.getElementById("myTextboxId")) ?
Like change myTextboxId to, i don't know, erm textarea?

See, cause its working, it is just not putting the text where I want it. I tried giving the text area an id name but its just ignoring it