Core Properties

bbar

Array

Bottom bar.


bbar: [{
  type: 'button',
  text: 'Text',
  handler: function(){}
}],

buttons

Array

Buttons bar


buttons: [{
  type: 'button',
  text: 'Text',
  handler: function(){}
}],

defaults

Object

Columns default properties.


defaults: {
  type: 'string',
  width: 100,
  editable: true,
  sortable: true
},

draggable

Boolean

If window param is true than draggable enables dragging of element over header.


var grid = new FancyGrid({
  window: true,
  modal: true,
  draggable: true,
  ...
});

grid.show();

events

Array

Form event handlers.


var form = new FancyForm({
  ...
  events: [{
    change: function(o){
      
    },
    scope: {}// not required
  }]
  ...
});

footer

Object

Footer bar.


var form = new FancyForm({
  ...
  footer: {
    status: '* - Devices online per 100 inhabitants in 2015',
    source: {
      text: 'OECD',
      link: 'oecd.org'
    }
  },
  ...
});

height

Mixed

Form height.

If value is 'fit', height will be set to content.


height: 500,

height: 'fit',

i18n

String

Localization.


var Form = new FancyForm({
  title: 'Localization - German',
  i18n: 'ge',
  ...
});

lang

Object

Localization.


var form = new FancyForm({
  title: 'Localization - German',
  lang: {
    paging: {
      of: 'von [0]',
      info: 'Zeilen [0] - [1] von [2]'
    }
  }
  ...
});

method

String

The request method to use for form actions.


var form = new FancyForm({
  ...
  url: 'submit.php',
  params: {
    param1: 1,
    param2: 'string'
  },
  method: 'POST',
  ...
});
GET

modal

Boolean

It enables modal for grid.

It requires do not define renderTo and set window.


var grid = new FancyForm({
  window: true,
  modal: true,
....
});

grid.show();
false

params

Object

Extra form params for request.


var form = new FancyForm({
  ...
  url: 'submit.php',
  params: {
    param1: 1,
    param2: 'string'
  },
  method: 'POST',
  ...
});

renderTo

String

Dom id, where to render form.


new FancyForm({    
  renderTo: 'container',
  width: 690,
  height: 350,
  ...

shadow

Boolean

Enable light shadow.


new FancyForm({    
  renderTo: 'container',
  width: 690,
  height: 350,
  shadow: false,
  ...
true

tbar

Array

Toolbar.


tbar: [{
  type: 'button',
  text: 'Add',
  action: 'add'
}],

title

String

Form title text.


title: 'Form of statistics',

theme

String

If you defined new theme, than property theme will enable it for form.


theme: 'my'

url

String

The URL to use for form actions.


var form = new FancyForm({
  ...
  url: 'submit.php',
  params: {
    param1: 1,
    param2: 'string'
  },
  method: 'POST',
  ...
});

width

Mixed

Form width.

If width is not set than form width become responsive.

If value is 'fit', width will be set to content.


width: 400,

height: 'fit',

window

Boolean

This param is used if grid is hidden on start and should be shown later.

It does grid positioned absolute.
It requires do not define renderTo.


var grid = new FancyForm({
  window: true,
  modal: true,
....
});

grid.show();
false