Switch

form

On/Off -switch

Example
HTML code
<INPUT type='text' size='2' id='69b6964766747' name='switch' value='0'>
    <SCRIPT>cms.get('ui','switch',{"name":"switch","value":0,"id":"69b6964766747","renderAs":"69b6964766747"});</SCRIPT>
Type atom
Group form
More examples

Custom color, text and icon

Multiple options

PHP

Wrapper to use element through PHP

Extends eUiElement
Render script
Create arguments
Code example

Basic

$this->get('ui', 'switch', Array(
  'name'    => 'form_name',
  'value'   => '1'
))

Title, icon, color

$this->get('ui', 'switch', Array(
  'name'    => 'form_name',
  'value'   => '0',
  'title'   => 'Title text',
  'icon'    => 'warning',
  'color'   => 'green'
));

All parameters

$this->get('ui', 'switch', Array(
  'id'      => '',       // default: name
  'name'    => 'form_name',
  'value'   => '0',
  'default' => '',       // Used if given value is not set. Default: 1st option.
  'title'   => 'Title text',
  'icon'    => 'warning',
  'color'   => 'green',   // Is set as 2nd option color
  'tooltip' => '',
  'width'   => '',       // Default: As width as content pushes it.
  'options' => Array(
    Array(
      'value' => 0,
      'icon'  => '',
      'title' => '',
      'color' => ''
    ),
    Array(
      'value' => 1,
      'icon'  => '',
      'title' => '',
      'color' => 'selected'
     )
   )
))

Javascript

Wrapper to use element through Javascript

Code example
var $Switch = cms.get('ui', 'switch', {
    name:    'form_name',
    value:   value,
    // Optional
    id:      'targetId'
    title:   'Switch button text',
    label:   'Text after switch',
    tooltip: 'Text',
    width:   100,
    default: 1,
    options: [{
        value: 0,
        icon: 'power-off',
        title: 'OFF',
        color: 'red'
    },{
        value: 1,
        icon: 'bolt',
        title: 'ON',
        color: 'green'
    }]
});

Styles

Elements Css style

table-cell
Fits nicely to table
inline
Fits nicely with text
justified
Array