Docs
API

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',

id

String

There are several ways to get link on grid object.
One of which is to set id and than to use Fancy.getWidget('myForm').

 

new FancyForm({
  id: 'myForm'
});

...
var form = Fancy.getWidget('myForm');

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
`