pax.widget.optiontransfer

This widget allow you to transfer options from one select to another

Author

Mikkel Bergmann, http://www.pointful.com

Summary
pax.widget.optiontransferThis widget allow you to transfer options from one select to another
Functions
pax.widget.optiontransfer.initInitialises the optiontransfer widget.
pax.widget.optiontransfer.templateReturns a PAX template for the widget

Functions

pax.widget.optiontransfer.init

pax.widget.optiontransfer.init = function(target,
args)

Initialises the optiontransfer widget.

Parameters

targetthe output DOM element
argsoptional argument object, ie: {}
  • options1 - list with options for the first select
  • options2 - list with options for the second select
  • size - how many options each select displays default = 7
  • sort - shall we sort the options as they are moved around, default = false
  • fieldName1 - name for field 1, default = ‘fieldName1[]’
  • fieldName2 - name for field 2, default = ‘fieldName2[]’
  • fieldId1 - ID for field 1, default = ‘fieldId1’
  • fieldId2 - ID for field 2, default = ‘fieldId2’
  • header1 - field 1 header, default = ‘Available’
  • header2 - field 2 header, default = ‘Selected’
  • move1Label - label for the move1 button, default = ‘»’
  • move2Label - label for the move2 button, default = ‘«’
  • moveAll1Label - label for the moveAll1 button, default = ‘»»’
  • moveAll2Label - label for the moveAll2 button, default = ‘««’
  • showMove1 - shall we show the move1 button, default = true
  • showMove2 - shall we show the move2 button, default = true
  • showMoveAll1 - shall we show the moveAll1 button, default = true
  • showMoveAll2 - shall we show the moveAll2 button, default = true
  • optionFilter - function that returns options we allow to move

Returns

nothing

Example

<div id='pax.widget.optiontransfer.example'>
    <select id='field1' name='field1[]'>
        <option value='1'>honey cake</option>
        <option value='2'>jam donut</option>
        <option value='3'>chocolate chip muffin</option>
    </select>

    <select id='field2' name='field2[]'>
        <option value='5'>Vanilla slice</option>
        <option value='4'>Rasphberry tartlet</option>
        <option value='6'>Lemon merang</option>
        <option value='9'>Banana split</option>
    </select>
</div>
[:
    pax.load.onloaded( function() {
        //  Optiontransfer example generated from existing HTML
        pax.widget.optiontransfer.init( pax.$('pax.widget.optiontransfer.example'), {
            options1: pax.$('field1'),
            options2: pax.$('field2')
        } );

    } );
:]
This will create a default optiontransfer widget

pax.widget.optiontransfer.template

pax.widget.optiontransfer.template = function()

Returns a PAX template for the widget

pax.widget.optiontransfer.init = function(target,
args)
Initialises the optiontransfer widget.
pax.widget.optiontransfer.template = function()
Returns a PAX template for the widget
Close