Is there a way to use OnMouseOver to select a radgrid row?

Question

I am currently highlighting a row in a radgrid using OnMouseOver. I would like to know if it is possible to use OnMouseOver to select the row rather than highlight it.

Alternatively, I would like the highlighted row to remain highlighted if the radgrid loses focus, such as when a confirmation box pops up.

Thanks in advance.

Answer 1

According to Telerik documentation, it should be possible to select the item OnMouseOver using the following code (if you don't have any detail tables you can nix the if statement and just use the code from the else block to find the currentDataItem):

function RadGrid1_RowMouseOver(sender, eventArgs) {
    var currentDataItem = null;

    // clear all currently selected items before selecting new
    sender.get_masterTableView().clearSelectedItems();

    if (eventArgs.get_itemIndexHierarchical().indexOf(':') > 0)
    {
        var detailTableIndex = eventArgs.get_itemIndexHierarchical().split(':')[0];
        var rowIndex = eventArgs.get_itemIndexHierarchical().split(':')[1].split('_')[1];
        currentDataItem = sender.get_detailTables()[detailTableIndex].get_dataItems()[rowIndex];
    }
    else
    {
        currentDataItem = sender.get_masterTableView().get_dataItems()[eventArgs.get_itemIndexHierarchical()];
    }

    if (currentDataItem != null)
    {
        currentDataItem.set_selected(true);
    }
}

Answer 2

Thanks! Your solution worked great, but rows would not become unselected when mousing over another row even if AllowMultiRowSelection was set to False. The following code will select a single row in the radgrid when the mouse hovers over the row:

<script type="text/javascript">

    function grdUsers_RowMouseOver(sender, eventArgs) {

        var NumberItems = sender.get_masterTableView().get_dataItems().length;
        for (var count = 0; count < NumberItems; count++) {
            var currentDataItem = sender.get_masterTableView().get_dataItems()[count];
            if (count == eventArgs.get_itemIndexHierarchical()) {
                currentDataItem.set_selected(true);
            }
            else {
                currentDataItem.set_selected(false);
            }
        }
    } 
</script>

I called the function at the following location:

<ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">
                    <Selecting AllowRowSelect="True" />
                    <ClientEvents OnRowMouseOver="grdUsers_RowMouseOver" />
                </ClientSettings>