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

8 posts, 0 answers
  1. Tinoy Malayil
    Tinoy Malayil avatar
    11 posts
    Member since:
    Oct 2011

    Posted 16 Dec 2011 Link to this post

    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.

  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 16 Dec 2011 Link to this post

    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.
  3. Tinoy Malayil
    Tinoy Malayil avatar
    11 posts
    Member since:
    Oct 2011

    Posted 16 Dec 2011 Link to this post

    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
  4. Tinoy Malayil
    Tinoy Malayil avatar
    11 posts
    Member since:
    Oct 2011

    Posted 19 Dec 2011 Link to this post

    To work thiese javascript functions should i place the RadGrid in Ajax Update Panel??
  5. Tinoy Malayil
    Tinoy Malayil avatar
    11 posts
    Member since:
    Oct 2011

    Posted 19 Dec 2011 Link to this post

    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
  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Dec 2011 Link to this post

    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.
  7. Murturza
    Murturza avatar
    1 posts
    Member since:
    Jul 2016

    Posted 17 Dec 2016 in reply to Shinu Link to this post

    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);
       }
    }

     

  8. Eyup
    Admin
    Eyup avatar
    3841 posts

    Posted 22 Dec 2016 Link to this post

    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.
Back to Top