Radio

form

Select value from predefined options.

Example
HTML code 
<DIV class="radio">
    <LABEL class="is-selected">
        <INPUT type="radio" id="basic_1" name="basic" value="1" checked />One</LABEL>
        <INPUT data-role='event_trigger' type="hidden" id="basic" value="1" />
        <LABEL>
            <INPUT type="radio" id="basic_2" name="basic" value="2" />Two</LABEL>
            <LABEL>
                <INPUT type="radio" id="basic_3" name="basic" value="3" />Three</LABEL>
            </DIV>
Type atom
Group form
Todo
BEM checkbox__label
Style: Color, Sizes.
All events? (only onchange set)
More examples

Buttons

Pills

Pill, icons

Stacked

PHP

Wrapper to use element through PHP

Extends eUiElementCheckbox
Render html
Create arguments name, value, option, title, icon
Code example

Basic

$this->get('ui', 'radio', Array(
  'name' => 'name',
  'value' => 1,
  'options' => Array(
    Array(
      'value' => 1,
      'title' => 'One'
    ),
    Array(
      'value' => 2,
      'title' => 'Twho'
    )
  )
);

Basic, array

$this->get('ui', 'checkbox', Array(
    'name'      => 'name',
    'value'     => $value,
    'option'    => '100',
    'title'     => 'Label text'
));

Multiple choices

$this->get('ui', 'checkbox', Array(
    'name'      => 'name', // adds [] to name!!
    'value'     => $value,
    'options'   => Array(
        Array(
          'value' => '1',
          'title' => 'One'
        ),
        Array(
          'value' => '2',
          'title' => 'Two'
        )
    )
));

All parameters

$this->get('ui', 'checkbox', Array(
    'name'     => 'form_name',
    'value'    => $value, // Selected value
    'default'  => '2',
    'style'    => 'button stacked',
    'tooltip'  => 'For whole group',
    'onchange' => 'For all options',
    'options'  => Array(
        Array(
            'value'    => '1',
            'id'       => 'form_id',
            'name'     => 'form_name',
            'title'    => 'One',
            'icon'     => 'app-warning',
            'color'    => 'green',
            'tooltip'  => 'Option tooltip',
            'onchange' => 'runMeForThisOption()'
        ),
    )
));

Javascript

Wrapper to use element through Javascript

Code example

Basic

var $Radio = cms.get('ui', 'radio', {
    name: 'radio',
    value: 1,
    options: [{
        value: 1,
        title: 'One'
    },{
        value: 2,
        title: 'Two'
    }]
});

Buttons

var $Radio = cms.get('ui', 'radio', {
    name: 'radio',
    value: 1,
    style: 'button justified'
    options: []
});

Icon

var $Radio = cms.get('ui', 'radio', {
    name: 'radio',
    value: 1,
    style: 'icon'
    // Overrides default icons
    icon: {
        on: 'circle-o',
        off: 'dot-circle-o'
    },
    options: [{
      // Overrides for this input
      icon: {
        on: 'circle',
        off: 'times-circle'
      }
    }]
});

Styles

Elements Css style

button
pill
stacked
border
image
Pelkkä kuva
icon
Pelkkä kuvake (ei otsikkoa), lisätään automaattisesti
jumbo
large
normal
small
mini