<h1>
    Deep Binding
</h1>
<p>
    Each grid column has a <b>binding</b> property that determines
    which property of the data item should be displayed in the cell. 
    In most of the cases, this property is a regular identifier
    such as 'name' or 'value'.
</p>
<p>
    But the grid also supports 'deep-binding', where the binding
    string contains a binding path composed of identifiers separated
    by periods. The syntax is similar to what you would use in
    regular JavaScript expressions.
</p>
<p>
    For example, if the data objects in the <b>itemsSource</b> array
    have a 'customer' property that contains a reference to a
    'Customer' object, you could use a 'customer.name' binding
    to show the customer's name on the grid:
</p>
@(Html.C1().FlexGrid().Id("theGrid").Height(200)
    .ShowAlternatingRows(false)
)

<p>
    Deep binding can be very useful in a number of scenarios, but
    you have to be aware of how binding works. In this example,
    editing the customer's first or last name will affect all
    rows that are bound to the same customer.
</p>
<p>
    Also, unlike regular bindings, deep bindings are not 'un-doable'
    by default. To enable undo for deep bindings, you should use
    the grid's <b>rowEditStarted</b> event to record the original
    deep-bound values, and the <b>rowEditEnding</b> event to
    restore those values if the edits are being canceled.
</p>
<p>
    <label>
        <input id="enableDeepUndo" type="checkbox" checked="checked">
        Enable deep binding undos
    </label>
</p>