This is a migrated thread and some comments may be shown as answers.

To Select /Deselect All Rows in a RadGrid with a Linkbutton in CommandItemTemplate

7 Answers 267 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tinoy Malayil
Top achievements
Rank 2
Tinoy Malayil asked on 16 Dec 2011, 10:34 AM
How to select all rows ina RadGrid Using a Link Button in CommandItemTemplate and also how to deselect all rows in a RadGrid using another link button in CommandItemTemplate.

7 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 1
answered on 16 Dec 2011, 10:45 AM
Hello,

Try the following javascript.
JS:
function Select()
 {
   var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
   var row = masterTable.get_dataItems();
   for (var i = 0; i < row.length; i++)
   {
     masterTable.get_dataItems()[i].set_selected(true);
   }
}
 function deselect()
 {
   var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
   var row = masterTable.get_dataItems();
   for (var i = 0; i < row.length; i++)
   {
     masterTable.get_dataItems()[i].set_selected(false);
   }
}

-Shinu.
0
Tinoy Malayil
Top achievements
Rank 2
answered on 16 Dec 2011, 11:10 AM
Hello Shinu,
I tried with the mentioned javascript but it is not working on by giving the OnClientClick event of the LinkButton.
Any other solution for this.
Regards,
Tinoy
0
Tinoy Malayil
Top achievements
Rank 2
answered on 19 Dec 2011, 07:24 AM
To work thiese javascript functions should i place the RadGrid in Ajax Update Panel??
0
Tinoy Malayil
Top achievements
Rank 2
answered on 19 Dec 2011, 07:44 AM
Hello Shinu,
The following are the codes  I have created. But unfortunately I couldn't able to Select or Deselect all Rows From CommandItem Template with the javascript functions. Please Help me to find a solution.

function RowSelected()
 {
    var grid = $find("<%=CandidatesGrid.ClientID %>");
    var MasterTable = grid.get_masterTableView();
    var selectedRows = MasterTable.get_selectedItems();
    var IDArray = new Array(MasterTable.get_selectedItems().length);
     
    for (var i = 0; i < selectedRows.length; i++)
    {
       
       
      IDArray[i] = MasterTable.get_selectedItems()[i]._itemIndexHierarchical;
       
            
    }
        
   
     __doPostBack( "ctl00_ContentPlaceHolder_CandidatesGrid", IDArray );
        
 }
  
 function SelectRows()
    {
            var masterTable = $find("<%= CandidatesGrid.ClientID %>").get_masterTableView();
            var row = masterTable.get_dataItems();
             
            for(i =0;i<row.length;i++)
            {
                masterTable.get_dataItems()[i].set_selected(true);
            }
    
 
    }
     
     function deselectrows()
    {
          
        var masterTable = $find("<%= CandidatesGrid.ClientID %>").get_masterTableView();
        var row = masterTable.get_dataItems();
        alert("HereD");
        for(i =0;i<row.length;i++)
         {
            masterTable.get_dataItems()[i].set_selected(false);
        }
    }
<table>
<tr>
     <td>
                                  
        <asp:UpdatePanel ID="updatePnlSkills" runat="server">
            <ContentTemplate>
                <fieldset style="border:0px;">
                    <table cellpadding="0" cellspacing="0">
                                                 
                        <tr>
                            <td>
                                                         
                                <asp:Panel ID="pnlSkills" runat="server">
                                     <asp:Literal ID="LitSkills" runat="server"></asp:Literal>
                                </asp:Panel>           
                            </td>
                        </tr>
                     </table>
                </fieldset>  
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="CandidatesGrid" Eventname="SelectedIndexChanged"/>
            </Triggers>
        </asp:UpdatePanel>
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" >
                                                                          
            <ProgressTemplate>
                <asp:Panel id="Panel1" Height="100%" runat="server" style="position:relative; left:0px; top:0px;">
                    <table style="width:100%;height:100%">
                        <tr>
                            <td align="center" style="padding-top:10px;vertical-align:top;">
                                <asp:Image id="imgReadingPaneLoading" runat="server" Height="29px" Width="30px" ImageUrl="~/Images/Loading.gif">
                                </asp:Image>
                            </td>
                        </tr>
                    </table>
                </asp:Panel>
            </ProgressTemplate>
        </asp:UpdateProgress>
        <table>
             
             <tr>
                <td>
                    <telerik:RadGrid ID ="CandidatesGrid" runat="server" ShowStatusBar="false" AllowPaging="True" AllowSorting="True"
                PageSize="3"  AllowMultiRowSelection="True" GridLines="None" Skin="Outlook" EnableAjaxSkinRendering="true" Width="100%">
                                                             
 
                    <MasterTableView Width="100%" ShowHeader="false" ClientDataKeyNames="ID" GroupLoadMode="Client" AutoGenerateColumns="false" >
                        <CommandItemTemplate>
                            <table>
                                <tr>
                                    <td style="width:76px;">
                                        <label id="lblSelectJobs" runat="server" style="font-weight:bold">Select Jobs</label>
                                    </td>
                                    <td>
                                        <asp:LinkButton ID="lnkSelectAll" runat="server" CommandName="SelectAll" Style="" OnClientClick="SelectRows">Select All</asp:LinkButton>
                                    </td>
                                    <td>
                                        <label id="lblLinkSeparater" runat="server">|</label>
                                    </td>
                                    <td>
                                        <asp:LinkButton ID="lnkDeSelectAll" runat="server" CommandName="DeSelectAll" Style="" OnClientClick="deselectrows">DeSelect All</asp:LinkButton>
                                    </td>
                                </tr>
                            </table>
                        </CommandItemTemplate>                                       
                        <Columns>              
                            <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" AutoPostBackOnFilter="true" ItemStyle-VerticalAlign="Top" />
                            <telerik:GridBoundColumn Visible="False" DataField="ID" UniqueName="ID" ItemStyle-Width="0"  />
                            <telerik:GridBoundColumn HeaderText="JobDetails" DataField="JobDetails" UniqueName="JobDetails" />
                                                                     
                        </Columns>
                    </MasterTableView>
                    <ClientSettings EnableRowHoverStyle="false" EnablePostBackOnRowClick="false">
                        <Selecting AllowRowSelect="True"/>
                        <ClientEvents OnRowSelected="RowSelected" OnRowDeselected="RowSelected" OnGridCreated="SelectRows"/>
                    </ClientSettings>        
                    </telerik:RadGrid>
                                                         
                </td>
            </tr>
        </table>
                                 
                                 
    </td>
</tr>
</table>


Regards,
Tinoy
0
Shinu
Top achievements
Rank 1
answered on 19 Dec 2011, 07:55 AM
Hello Tinoy,

Try calling the function as shown below.
aspx:
<CommandItemTemplate>
  <asp:LinkButton ID="lnkSelectAll" OnClientClick="SelectRows();" runat="server" CommandName="SelectAll" Style="" >Select All</asp:LinkButton>
</CommandItemTemplate>

-Shinu.
0
Murturza
Top achievements
Rank 1
answered on 18 Dec 2016, 04:58 AM

Is their any other efficient way to select all rows , as IE11 browser become unresponsive for 972 rows in my case . 

function Select()
 {
   var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
   var row = masterTable.get_dataItems();
   for (var i = 0; i < row.length; i++)
   {
     masterTable.get_dataItems()[i].set_selected(true);
   }
}

 

0
Eyup
Telerik team
answered on 22 Dec 2016, 06:30 AM
Hi Murturza,

You can check the suggestions provided in the following post:
http://www.telerik.com/forums/radgrid-becomes-too-slow-when-binding-over-100-records#qxa2LUwVA0WYQpqmpwjrTg

Regards,
Eyup
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Tinoy Malayil
Top achievements
Rank 2
Answers by
Shinu
Top achievements
Rank 1
Tinoy Malayil
Top achievements
Rank 2
Murturza
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or