Telerik RadGrid not allowing to deselect row when there is only one row

asp.nettelerik-grid

I have two things that need to happen on the click event of a Radgrid. I am using the GridClientSelectColumn so if the user clicks the checkbox it should select the row. By the same token if the user clicks to uncheck the checkbox, it should deselect the row.

I also need to get a count of the selected rows and it the count > 0, I need to disable some other controls.

Here is my javascript so far.

function ChecklistsGrid_RowSelected(rowIndex) {
if (rowIndex == selectedRowIndex) {
    window["<%= ChecklistsGrid.ClientID %>"].MasterTableView.DeselectRow(window["<%= ChecklistsGrid.ClientID %>"].MasterTableView.Rows[rowIndex].Control);
    return false;
}
selectedRowIndex = rowIndex;

}

And here is my grid.

<telerik:RadGrid ID="ChecklistsGrid" runat="server" Skin="WF" ShowHeader="false" EnableEmbeddedSkins="false" OnItemDataBound="ChecklistsGrid_ItemDataBound" >
                                                <ClientSettings EnableRowHoverStyle="true" EnableAlternatingItems="true">
                                                    <Selecting AllowRowSelect="True" />
                                                    <ClientEvents OnRowSelected="ChecklistsGrid_RowSelected" />
                                                </ClientSettings>
                                                <MasterTableView Width="100%" CommandItemDisplay="Bottom" AutoGenerateColumns="false" TableLayout="Fixed"  >
                                                    <RowIndicatorColumn Visible="False">
                                                        <HeaderStyle Width="20px" />
                                                    </RowIndicatorColumn>
                                                    <ExpandCollapseColumn Resizable="False" Visible="False">
                                                        <HeaderStyle Width="20px" />
                                                    </ExpandCollapseColumn>
                                                    <Columns>
                                                        <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" HeaderStyle-Width="30" />
                                                        <telerik:GridBoundColumn HeaderText="Project - Package" UniqueName="ProjectPackages"></telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn DataField="Id" HeaderText="Checklist Id" HeaderStyle-Width="75" UniqueName="ChecklistId"></telerik:GridBoundColumn>
                                                    </Columns>
                                                </MasterTableView>

                                                <HeaderStyle BackColor="#666666" Font-Names="verdana, arial" Font-Size="Small" Height="20px" />
                                            </telerik:RadGrid>

The other thing I should maybe mention is this in a page that uses masterpages.

Please help. I am stuck. I have 3 different grids in the application that I need to do this with.

Thanks,

Rhonda

Best Answer

Add a GridClientSelectColumn:

<telerik:GridClientSelectColumn UniqueName="SelectColumn">
    <HeaderStyle Width="27px" HorizontalAlign="Center" />
    <ItemStyle HorizontalAlign="Center" />
</telerik:GridClientSelectColumn>  

The error you're receiving has nothing to do with master pages. It's because you're not referencing the RadGrid correctly in your JavaScript.

Instead of using OnRowSelected, try using OnRowClick and do something like this:

onRowClick = function(sender, args){
    var grid = $find("<%=grdVendors.UniqueID%>");
    if (grid){
        var item = grid.get_masterTableView().get_dataItems()[args.get_itemIndexHierarchical()];
        if (item.get_selected()){
            item.set_selected(false);
        }        
    }
}

I would suggest looking at the documentation and getting fimiliar with the client-side API. Telerik has one of the best support teams around, and their forum and knowledge base is excellent.

Here's a link to the client-side API reference:
http://www.telerik.com/help/aspnet-ajax/grid-getting-familiar-with-client-side-api.html

Here's some documentation on desecting rows client-side:
http://www.telerik.com/help/aspnet-ajax/grid-gridtableview-deselectitem.html

Related Topic