1. Hugh (cheesegrits) here. Thank you for all the good wishes. My back surgery was a success, post-op recovery is going well, and I'm getting stronger and feeling better every day. I hope to be getting back in the saddle and working support again over the next few days.
  2. IMPORTANT NOTE - we have made some changes in our github branch naming. The 'master' branch no longer exists, and is now called 'joomla25' (which is Fabrik 3.0). The 'joomla3' branch (which is Fabrik 3.2) remains unchanged. We have also removed all the other testing branches which had accuulated over the last few years. I have posted a thread in the Community forum for 3.0 with some more information, feel free to as questions there.

Trick: Copy to Clipboard

Discussion in 'Hints, Tips and Tricks' started by grey666, Sep 30, 2011.

  1. grey666 Member

    Level: Community
    This is a very obscure trick, but worthwhile at the same time.

    This allows you to copy any data to the windows clipboard from any field in any Fabrik form - on any javascript event.

    Download the code, place it in it's own directory - i.e. "www/zeroclipboard". www is your root web directory.

    Download the code here:
    http://code.google.com/p/zeroclipboard/downloads/list

    Next ...

    In the Fabrik form, place the following code in the Introduction area: Use the HTML Button ... (This puts a button at the top of your form, using Flash.)

    <script src="zeroclipboard/ZeroClipboard.js" type="text/javascript"></script>
    <div id="d_clip_button" style="border: 1px solid black; padding: 5px; margin: 5px; width: 40%;">Text To Clipboard</div>
    <script type="text/javascript">// <![CDATA[
    ZeroClipboard.setMoviePath( 'http://yourdomain.com/zeroclipboard/ZeroClipboard10.swf' );
    var clip = new ZeroClipboard.Client();
    clip.setHandCursor( true );
    clip.setText( 'Copy me!' );
    clip.glue( 'd_clip_button' );
    // ]]></script>


    Next, add a javascript event to any Fabrik field.

    For example... a text box field. Add javascript, Action: On Change:
    clip.setText( $('db_content___Text').value );

    db_content is the Fabrik table name, Text is the field.


    Action: On Load:
    clip.setText( $('db_content___Text').value );


    That's it... click a button and the data from your Fabrik fields is copied to the Windows clipboard.

    Try mouse-over... it's fun.


    Multiple zeroclipboard buttons: (Fabrik Form, Introduction, HTML)
    <script src="zeroclipboard/ZeroClipboard.js" type="text/javascript"></script>
    <table style="width: 100%;" border="0"><tbody><tr><td>
    <div id="d_clip_button" style="border: 1px solid black; padding: 5px; margin: 5px; width: 40%;">Text To Clipboard</div>
    <script type="text/javascript">// <![CDATA[
    ZeroClipboard.setMoviePath( 'http://yourdomain.com/zeroclipboard/ZeroClipboard10.swf' );
    var clip = new ZeroClipboard.Client();
    clip.setHandCursor( true );
    clip.setText( 'Copy me!' );
    clip.glue( 'd_clip_button' );
    // ]]></script>
    </td><td>
    <div id="e_clip_button" style="border: 1px solid black; padding: 5px; margin: 5px; width: 40%;">Output To Clipboard</div>
    <script type="text/javascript">// <![CDATA[
    ZeroClipboard.setMoviePath( 'http://Yourdomain.com/zeroclipboard/ZeroClipboard10.swf' );
    var clip2 = new ZeroClipboard.Client();
    clip2.setHandCursor( true );
    clip2.setText( 'Copy me!' );
    clip2.glue( 'e_clip_button' );
    // ]]></script>
    </td></tr></tbody></table>


    This creates two flash movies ... at the top of your form, which can monitor two different Fabrik fields at the same time.

Share This Page