DataBinding¶

Data binding is a linking between elements and sources.

Description¶

Data binding allows synchronize property values of two different objects. One is conditionally called element while another is source. Elements are often representations of visual view while sources are - data sources. Typically that doesn’t matter which element will be the element and wich be the source because both represent the same interface. Objects that can bind data are all types of visual elements, all types of Data Sources and View Parameters.

Any data binding can be representd as non-visual programm object which can define the data conversion rules for both element and source, as well as desirable direction of data streams in binding mode:

Bi-directional exchange between element and source - if source has got updates then element gets updated otherwise if element has got updates then element gets updated accordingly.
To source updates - if source has got updates then no change to element is done, otherwise if element has got updates then source gets updated.
To element update - if source has got updates element gets updated otherwise source gets no update.

Data binding thus conceals complexity of synchronizing between elements and sources and simplifies the code to great extent and makes behaviour of all elements controllable.

Syntax¶

new DataBinding()

Parameters¶

No

Returns¶

DataBinding

Usage¶

//js-demo
var element = new InfinniUI.TextBox();
var $element = element.render();
element.setLabelText("Element");

var source = new InfinniUI.TextBox();
var $source = source.render();
source.setLabelText("Source");

var binding = new InfinniUI.DataBinding();
binding.setMode('ToSource');
binding.bindSource(source, 'value');
binding.bindElement(element, 'value');

$elementForExample.append($element);
$elementForExample.append($source);

Methods¶

Name	Description
getMode	Returns direction of data stream in binding mode
setMode	Sets direction of data stream in binding mode
getConverter	Returns data converter between element and source
setConverter	Sets data converter between element and source
bindSource	Sets binding to source
getSource	Returns data source binding
getSourceProperty	Returns path to data source property binding
bindElement	Sets binding to element
getElement	Returns element binding
getElementProperty	returns path to element binding property
getDefaultValue	Returns element defaul value
setDefaultValue	Sets default value for element

Events¶

No

DataBinding.metadata¶

Метаданные типа DataBinding.

Properties¶

Name	Type	Default	Description
Source*	`String`	–	Наименование источника данных привязки
Property	`String`	–	Путь к свойству источника данных привязки
Mode	BindingMode	`TwoWay`	Направление потока данных в привязке
Converter	BindingConverter	–	Преобразователь данных между элементом и источником

* Обязательное свойство.

Examples¶

Метаданные поля ввода, привязанного к параметру Parameter_1:

{
    "TextBox": {
      "Value": {
        "Source": "Parameter_1"
      }
    }
}

Пусть теперь поле ввода привязано к полю Name источника данных DataSource_1. И пусть при изменении источника, необходимо обновлять поле ввода, но изменение значения поля ввода не должно влиять на значение в источнике. Тогда метаданные выглядят так

{
    "TextBox": {
      "Value": {
        "Source": "DataSource_1",
        "Property": "Name",
        "Mode": "ToElement"
      }
    }
}

Пример, когда данные необходимо конвертировать:

{
    "TextBox": {
      "Value": {
        "Source": "DataSource_1",
        "Property": "Name",
        "Converter": {
            "ToElement": "{ return args.value == '-' ? 'minus': 'plus'; }",
            "ToSource": "ConvertTextBoxToDataSource_1" //выполнится скрипт из контекста родительской view
        }
      }
    }
}