RadGrid: Checkbox selected when row is highlighted. MutltiSelection is set

[Jiangtao Hu]

Hi,

I set "AllowMultiRowSelection" to "true" in the grid, which causes GridClientSelectColumn columns to be added in the first column of the grid. The issue is that when I highlight a row, the checkbox is selected.
Is there any property/event that I can set/remove to prevent checking off the checkbox when I highlight the row?


Thanks in advance,
Mohammad

[Shinu]

Hi Mohammad,

AllowRowSelect/AllowMultiRowSelect property allows user to select Grid rows either clicking on the row or clicking on the GridClientSelectColumn's CheckBox. If you dont want the GridClientSelectColumn to be there try either removing the column from the Grid's Column collection or hide the column.

If you want to highlight the row instead of selecting on clicking the row, you can try the below client side code. In this case you can select the row only by using the checkbox column. Attach the events RowSelecting and Rowcreating with RadGrid.

JavaScript:

function RowSelecting(sender, eventArgs)
{
    var e = eventArgs.get_domEvent();
    //IE - srcElement, Others - target
    var targetElement = e.srcElement || e.target;
    //is the clicked element an input checkbox? <input type="checkbox"...>
    if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox"))// && currentClickEvent)
    {
        var e = eventArgs.get_domEvent();
        var grid = $find("<%=RadGrid1.ClientID %>");
        var row = eventArgs.get_gridDataItem();
        eventArgs.set_cancel(true);
        if(row._element.style.backgroundColor!='#cad3e4')
            row.get_element().style.backgroundColor='#cad3e4';
        else
            row.get_element().style.backgroundColor="";
    }
}
function RowCreating(sender, eventArgs)
{
}

Thanks,
Shinu.

[Jiangtao Hu]

Hi Shinu,

Thanks for the reply.

I forgot to mention that I'm using Telerik Q2 2007 in my control. Please advice if this might be the case that I explained below.

I'm encountering an issue with the "eventArgs" passing to the OnRowSelecting method. It says it doesn't support none of the method calls on it.

I'm using the Grid as part of an AJAX enabled custom control named Lookup. The lookup control has a lookup.js javascript class file for client support.
In the Lookup Control I set the following setting for event.

grid.ClientSettings.ClientEvents.OnRowSelecting =

 

    RSScriptManager.RegisterDelegate2((Control) LookupInternal, GetClientComponentName(),

 

 

 

"_rowSelectingHandler", "OnRowSelecting");

 

 

 

which at run time sets 
grid.ClientSettings.ClientEvents.OnRowSelecting = "FundingRequestsByAgreement_ListStep__rowSelectingHandler_OnRowSelecting"

Following is the way the script generated .

function FundingRequestsByAgreement_ListStep__rowSelectingHandler_OnRowSelecting()
{
    return FundingRequestsByAgreement_ListStep._rowSelectingHandler.apply(FundingRequestsByAgreement_ListStep, arguments);
}

Which "_rowSelectingHandler" function is a method in the client side class of "FundingRequestsByAgreement_ListStep" object. In this method I've customized your code snippet for the OnRowSelecting event.

 

 

var e = eventArgs.get_domEvent();

 

 

 

//IE - srcElement, Others - target

 

 

 

 

 

var targetElement = e.srcElement || e.target;

 

 

 

//is the clicked element an input checkbox? <input type="checkbox"...>

 

 

 

 

 

 

if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox"))

 

{

 

 

var e = eventArgs.get_domEvent();

 

 

 

var grid = this.get_grid();

 

 

 

var row = eventArgs.get_gridDataItem();

 

eventArgs.set_cancel(

 

true);

 

 

 

if(row._element.style.backgroundColor!='#cad3e4')

 

row.get_element().style.backgroundColor=

 

'#cad3e4';

 

 

 

else

 

 

 

row.get_element().style.backgroundColor=

 

"";

 

}

 

 

When the event is fired, the first line of the script which is "var e = eventArgs.get_domEvent();"  throws exception and per my investigation the "eventArgs" parameter is not what the event handler expects and it doesn't have the method or propreries which are called here.

Please note that I use "arguments" and "apply" javascript keywords, which are specific to this purpose.

I'd appreciate your reply.

Thanks,
Mohammad

 

 

 

 

 

 

 

[Dimo]

Hi, how to avoid checkbox deselect if row clicked and already have checked checkboxes - to preserve checked rows as checked?

[Veli]

Hi Dimo,

RadGrid does not preserve the previously selected items when you click on a single item. You can, however, set RadGrid.ClientSettings.Selecting.UseClientSelectColumnOnly = true and use a GridClientSelectColumn to select rows only through the CheckBoxes in the column. Thus, clicking on checkboxes you will preserve previously selected items if AllowMultiRowSelection =  true

Best wishes,
Veli
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Bharat]

Hi Veli,

I have a website and m using the Telerik Grid.
Autogenerated column is false.
By applying this logic,,sometimes while clicking the row, the checkbox is getting selected.. I don't know why it is happening.

Please respond ASAP

Bharat Rathore

[Veli]

Hi Bharat,

You may want to open a support ticket and send us a test page/project demonstrating your scenario. We cannot advise you without more information on this topic. Please state what you are trying to implement and the exact steps to reproduce the behavior you are getting.

Greetings,
Veli
the Telerik team