Grid

container

Add responsive Rows

Example
Col2
Col4
Col6
HTML code 
<DIV class="row">
    <DIV class="col col-md-2">Col2</DIV>
    <DIV class="col bg-gray col-md-4">Col4</DIV>
    <DIV class="col col-md-5">Col6</DIV>
</DIV>
Type organism
Group container
Elements row
Documentation

Set grid parameters to grid and add rows/cols through them.

Javascript

Wrapper to use element through Javascript

Methods
Method name Description
createRow(params) Create new row and return it.
addRow(col1, col2) Create a new row and add it to Grid.
appendRow(col1, col2) Create a new row and add it to Grid.
prependRow(col1, col2) Same as addRow(), but adds new row to beginning of grid
getRow() Get last row. Create, if none.
addCol(col1, col2) Add col to last row. Arguments as in row.addCol().
newCol() Add col to last row and return it. Arguments as in row.newCol().
Code example

Basic

var $Grid = cms.get('ui', 'grid'); // @todo What are basic use parameters??

$Grid.addRow('Label', 'Input'); // Argumetns are cols data
$Grid.addRow('Label', ['Input', 'infoTxt']); // Col data can be also a list
var $Row  = $Grid.newRow();
var $Col  = $Row.newCol();

$Grid.newRow()
  .addCol(2, 'Col content')
  .addCol(10, 'Col content');

All parameters

var $Grid = cms.get('ui', 'grid', {
  row: {
  }, // All ui.row parametrit!
});
$Row = $Grid.addRow('Label', 'Input');
$Row = $Grid.addRow('Label'[, 'Input', 'infoTxt']);

Chained

var $Grid = cms.get('ui', 'grid').appendTo( $DIV )
  .newRow()
    .addCol( 4 , cms.get('ui', 'label', 'Eräpäivä') ) // @todo lang
    .addCol( 8 , cms.get('field', 'date').input({
      name: 'due_date',
      id: 'todo_due_date_'+Todo.id,
      value: Todo.due_date
    }) )
$Grid.newRow()
    .addCol( 'md-4 xs-6' , cms.get('ui', 'switch', {
      name: 'status',
      value: Do.parseInt(Todo.status),
      options: [1,10],
      label:   cms.get('lang','fieldtype/todo/status/done')
    }) );

Styles

Elements Css style

bordered < class='grid bordered'>Bordered
Add borders arois all cols.
condensed < class='grid condensed'>Condensed
Remove all margins and paddings
justified < class='grid justified'>Justified
Remove main margins and paddings
padding < class='grid padding'>Padding
Make vertical space (grid+col, top+bottom)