39
Name
Description
and an HTML fragment that is used as a cell template. Grid rows automatically stretch vertically to fit
custom cell contents.
Both the wjStyle binding and the HTML fragment can use the $item observable variable in
ble in
KnockoutJS bindings to refer to the item that is bound to the current row. Also available are
the $row and $col observable variables containing cell row and column indexes. For example:
ample:
<div data-bind="wjFlexGridColumn: {
header: 'Symbol',
binding: 'symbol',
readOnly: true,
width: '*' }">
<a data-bind="attr: {
href: 'https://finance.yahoo.com/q?s=' + $item().symbol() },
text: $item().symbol">
</a>
</div>
<div data-bind="wjFlexGridColumn: {
header: 'Change',
binding: 'changePercent',
format: 'p2',
width: '*'
},
wjStyle: {
color: getAmountColor($item().change) }">
</div>
These bindings create two columns. The first has a template that produces a hyperlink based on the
bound item's "symbol" property. The second has a conditional style that renders values with a color
determined by a function implemented in the controller.
wjFlexGridFilter
KnockoutJS binding for the FlexGrid FlexGridFilter object.
ect.
The wjFlexGridFilter binding must be contained in a wjFlexGrid binding. For example:
ample:
<p>Here is a FlexGrid control with column filters:</p>
<div data-bind="wjFlexGrid: { itemsSource: data }">
<div data-bind="wjFlexGridFilter: { filterColumns: ['country', 'amount'] }"></div>