Adding text to textarea via a javascript button will not consistently work

[mark22]

I have a textarea with a separate toolbar on the side that will add little smilie faces or characters into the textarea by clicking a a toolbar button. I'll give you two scenarios, in both cases the smilie face has been inserted into the box by pressing a smilie face icon.

Scenario A

Hi @mark22 how are :) you?

In scenario A, it works just fine. I think its because I'm physically typing text after my javascript inserted Output:

Scenario B

Hi @mark22 how are you? :)

In scenario B, the smilie face at the end does not get submitted into my form.

Output:

If my hunch is correct that the script is actually updating the final to be submitted textarea content everytime a user types a character, is there an 'update' call I can make when a user clicks submit to make one final update to capture the trailing externally added characters? Or some other possible solution?...

[ivirabyan]

If you manually changed contents of the textarea, you have to trigger change event (since it is not triggered when you change value programmaticaly):

var $textarea = $("textarea"),
      value = $textarea.val();
$textarea.val(value + ":)").change();