@model IEnumerable<FlexGridData.Sale>

<h1>
    Selection
</h1>
<p>
    By default, the <b>FlexGrid</b> allows you to select a
    range of cells with the mouse or keyboard, just like Excel.
</p>
<p>
    The <b>selectionMode</b> property allows you to change this behavior
    so that users can be restricted from selecting rows, row ranges,
    non-contiguous rows (like in a list-box), single cells,
    or nothing at all.
</p>
@Html.C1().FlexGrid().Id("theGrid").Bind(Model).ShowAlternatingRows(false)
<label>
    selectionMode
    @Html.C1().ComboBox().Id("selectionMode").Bind(new[] {"None", "Cell", "CellRange", "Row", "RowRange", "ListBox" }).Text("CellRange")
</label>

<p></p>
<p>
    Regardless of the current <b>selectionMode</b>, the grid raises
    <b>selectionChanging</b> and <b>selectionChanged</b> events
    when the selection changes. And you can use the <b>selection</b>
    property to get or set the current selection as a
    <b>CellRange</b> value.
</p>
<p>
    <button id="btnSelect" class="btn btn-default">
        Select the first four cells
    </button>
</p>
<p>
    Current selection: <span id="currSel"></span>.
</p>

<p></p>
<p>
    In <b>ListBox</b> mode, users can select individual rows using
    ctrl+click, and you can check whether rows are selected
    using the row's <b>isSelected</b> property.
</p>
<p>
    <button id="btnListSelect" class="btn btn-default">
        Select rows 0, 2, and 4
    </button>
</p>

<p></p>
<p>
    The <b>FlexGrid</b> has built-in clipboard support.
    Press ctrl+c to copy the current selection to the
    clipboard.
</p>