# XForms/A Trigger for Inserting BBcode into a Textarea box

## Using Trigger to Add BBcode or Other Text to Input or Textarea Controls

Here is a simple way to use a button (trigger) to add commonly used text
to your xforms-input or xforms-textarea controls. This could be many
things such as BBcode (bold/unbold codes), date-time stamps, frequently
used formatted text such as a letterhead, signature blocks, special
codes that aren\'t easy to remember\-- all depending on the purpose of
your form and your specific needs.

## Link to working XForms Application

Load Example XForms
Application

A more advanced example for inserting at the beginning or end of text
(with some additional code inserts such as links and images)

Load Example XForms
Application

## Program Structure

For simplification, we are using a single `<text/>`{=html} element in
our model/instance to hold our example input. The style is not really
necessary other than to give one a larger text area to test with.

The real power, and simplicity, of the form is in the value attribute of
the xforms-setvalue element which itself is placed inside an
xforms-trigger:

`  value="concat(//text,'whatever you desire goes here')"`

## Sample Program

``` html
   <html 
   xmlns="http://www.w3.org/1999/xhtml" 
   xmlns:xf="http://www.w3.org/2002/xforms" 
   xmlns:ev="http://www.w3.org/2001/xml-events">
   <head>
      <title>Insert BB code</title>
         <style type="text/css">  <!--mozilla specific style-->
         @namespace xf url('http://www.w3.org/2002/xforms');
         xf|textarea .xf-value{ width:25em; height:20ex; }
         </style>
      <xf:model>
         <xf:instance>
            <data xmlns="">    
               <text/>
            </data>
         </xf:instance>
      </xf:model>
   </head>
   <body>
      <xf:trigger><xf:label>Bold</xf:label>
         <xf:action ev:event="DOMActivate">
            <xf:setvalue ref="//text" value="concat(//text,'[b][/b] ')"/> 
            <xf:setfocus control="textArea"/>     
         </xf:action>
      </xf:trigger><br/>
      <xf:textarea id="textArea" ref="//text">
          <xf:label>Post:</xf:label>
      </xf:textarea>
   </body>
   </html>
```

## Discussion

This solution will only append the inserted code/text to the end of the
current text in the text box. To have it always at the beginning, simply
change the order of the arguments in your concat function (see the
second example link above).

Limitation: This solution cannot insert code/text into the middle of the
current text in the text box.

You can use html entities to do complex formats like a letterhead (if
you need to preserve space or bold etc..) (!!note: the ampersand-& is
replaced by the percent-% as I couldn\'t figure out how to escape html
entities in this wikibook)

``` xml
   <xf:setvalue ref="//text" value="concat(//text,'
      %lt;div xmlns=%quot;http://www.w3.org/1999/xhtml%quot;%gt;
         %lt;p%gt;%lt;b%gt;Testing insert with HTMLentities%lt;/b%gt;
         %lt;/p%gt;
         %lt;p%gt;%lt;i%gt;Testing Insertwith HTMLenitites%lt;/i%gt;
         %lt;/p%gt;
         %lt;pre%gt;     Indent Here%lt;/pre%gt; 
      %lt;/div%gt;')"/>
```

In such a case, make sure your xforms-output has a mediatype attribute
like so:

``` xml
   <xf:output ref="//text" mediatype="application/xhtml+xml"/>
```

## Discussion

