GridClientSelectColumn - determine whenever any (or all) rows are selected - client-side ?

2 posts, 0 answers
  1. Ryan
    Ryan avatar
    12 posts
    Member since:
    Jun 2013

    Posted 21 Oct Link to this post

    Hello,

    The RadGrid events for the  GridClientSelectColumn , eludes me .  I think we can make the assumption it contains a check box.  But how do we inspect client events/state on this control .

     

    [in client/javascript]

    I simply want to know , when a user clicks on one (or more) check boxes in the GridClientSelectColumn , to determine if they checked or unchecked the row ?

    The purpose : I am trying to hide a RadButton , if none of my ( GridClientSelectColumn ) rows are selected.  However, if even one is selected, I want to show my RadButton.  I also need to take into account if the user clicks on the column header checkbox ( [de]selecting all ) .

     

    Thank you for your guidance !

  2. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1800 posts

    Posted 26 Oct Link to this post

    Hello Ryan,

    You can handle the OnRowSelected and OnRowDeselected events of the grid to toggle the visibility of the button:
    <telerik:RadCodeBlock runat="server">
        <script>
            function rowSelected(sender, args) {
                toggleButton(sender);
            }
     
            function rowDeselected(sender, args) {
                toggleButton(sender);
            }
     
            function toggleButton(sender) {
                var button = $find("<%=RadButton1.ClientID%>");
            if (sender.get_selectedItems().length == 0) {
                button.set_visible(true);
            }
            else {
                button.set_visible(false);
            }
        }
        </script>
     
    </telerik:RadCodeBlock>
    <telerik:RadButton runat="server" ID="RadButton1" Text="Click me"></telerik:RadButton>
    <telerik:RadGrid runat="server" OnNeedDataSource="RadGrid1_NeedDataSource">
        <MasterTableView>
            <Columns>
                <telerik:GridClientSelectColumn></telerik:GridClientSelectColumn>
            </Columns>
        </MasterTableView>
        <ClientSettings>
            <Selecting AllowRowSelect="true" />
            <ClientEvents OnRowSelected="rowSelected" OnRowDeselected="rowDeselected" />
        </ClientSettings>
    </telerik:RadGrid>

    Please give this a try and let me know if the result meets your requirements.


    Best Regards,
    Konstantin Dikov
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top