Selection Mode

The selectionMode option of the wijgrid widget provides various options for a user to change the mode of selection. The selectionMode option determines whether single or multiple cells, columns, rows, or ranges of cells can be selected at one time. By default, its value is singleRow. However, you can change its value to none, singleCell, singleColumn, singleRange, multiColumn, multiRow and multiRange.

For example, the script and markup sets the value of selectionMode option to singleCell and also provides a dropdown at bottom left of the wijgrid to allow user to select the desired selection mode.

Live Widget
Script
Markup

Script	Copy Code
<script type="text/javascript"> $(document).ready(function () { $('#wijgrid').wijgrid({ data: [ { User_ID: '01', User_FirstName: 'Henry', User_LastName: 'Holt' }, { User_ID: '02', User_FirstName: 'Mathew', User_LastName: 'McDonald' }, { User_ID: '03', User_FirstName: 'Crystal', User_LastName: 'Castillo ' }, { User_ID: '04', User_FirstName: 'Oliver', User_LastName: 'Schwartz ' }, { User_ID: '05', User_FirstName: 'Betsy', User_LastName: 'Baldwin ' }, { User_ID: '06', User_FirstName: 'Felix', User_LastName: 'Ford ' } ], // Setting selection mode selectionMode: 'singleCell' }); }); </script>

Script

Copy Code

<script type="text/javascript">
    $(document).ready(function () {
        $('#wijgrid').wijgrid({
            data: [
                { User_ID: '01', User_FirstName: 'Henry', User_LastName: 'Holt' },
                { User_ID: '02', User_FirstName: 'Mathew', User_LastName: 'McDonald' },
                { User_ID: '03', User_FirstName: 'Crystal', User_LastName: 'Castillo ' },
                { User_ID: '04', User_FirstName: 'Oliver', User_LastName: 'Schwartz ' },
                { User_ID: '05', User_FirstName: 'Betsy', User_LastName: 'Baldwin ' },
                { User_ID: '06', User_FirstName: 'Felix', User_LastName: 'Ford ' }
            ],
            // Setting selection mode
            selectionMode: 'singleCell'
        });
    });
</script>

Script	Copy Code
<table id="wijgrid"></table> <label for="selectionMode">Selection Mode:</label> <select id="selectionMode" onchange="$('#wijgrid').wijgrid('option', 'selectionMode', $('#selectionMode').val());"> <option value="none">none</option> <option value="singleCell" selected>singleCell</option> <option value="singleColumn">singleColumn</option> <option value="singleRow">singleRow</option> <option value="singleRange">singleRange</option> <option value="multiColumn">multiColumn</option> <option value="multiRow">multiRow</option> <option value="multiRange">multiRange</option> </select>

Script

Copy Code

<table id="wijgrid"></table>
<label for="selectionMode">Selection Mode:</label>
<select id="selectionMode" onchange="$('#wijgrid').wijgrid('option', 'selectionMode', $('#selectionMode').val());">
    <option value="none">none</option>
    <option value="singleCell" selected>singleCell</option>
    <option value="singleColumn">singleColumn</option>
    <option value="singleRow">singleRow</option>
    <option value="singleRange">singleRange</option>
    <option value="multiColumn">multiColumn</option>
    <option value="multiRow">multiRow</option>
    <option value="multiRange">multiRange</option>
</select>