How to set toggle button in a ToggleList to toggled client side

2 posts, 0 answers
  1. Paul
    Paul avatar
    114 posts
    Member since:
    May 2009

    Posted 03 Oct 2018 Link to this post

    Hi,
        I'm trying to set the toggle state of a button in a togglelist from client side code but nothing I try works. 

    <telerik:RibbonBarGroup Text="Status Filter">
               <Items>
                   <telerik:RibbonBarToggleList>
                       <ToggleButtons>
                           <telerik:RibbonBarToggleButton Value="StatusFilterAll" Size="Medium" Text="All" Toggled="true" />
                           <telerik:RibbonBarToggleButton Value="StatusFilterOpen" Size="Medium" Text="Open" />
                           <telerik:RibbonBarToggleButton Value="StatusFilterInProgress" Size="Medium" Text="In Progress" />
                           <telerik:RibbonBarToggleButton Value="StatusFilteronHold" Size="Medium" Text="On Hold" />
                           <telerik:RibbonBarToggleButton Value="StatusFilterClosed" Size="Medium" Text="Closed" />
                           <telerik:RibbonBarToggleButton Value="StatusFilterAllExClosed" Size="Medium" Text="All Except Closed" />
                       </ToggleButtons>
                   </telerik:RibbonBarToggleList>
               </Items>
           </telerik:RibbonBarGroup>

     

    I have tried 

    ServiceDeskRibbonbar.findToggleButtonByValue("StatusFilterAll").get_toggleList().set_toggledButton(ServiceDeskRibbonbar.findToggleButtonByValue("StatusFilterAll" ))

     

    This does not seem to do anything. I have also tried 

    ServiceDeskRibbonbar.findToggleButtonByValue("StatusFilterAll" ).set_toggled(true)

     

    This selects that item but the previous item still stays selected as well and the OnClientToggleListToggled is never fired.

    So what is the correct way to achieve this?

    Thanks

  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    4611 posts

    Posted 04 Oct 2018 Link to this post

    Hello Paul,

    The easiest approach is to mimic a user click on the button. For example:

    <telerik:RadRibbonBar runat="server" ID="RadRibbonBar1" OnToggleListToggle="RadRibbonBar1_ToggleListToggle">
        <Tabs>
            <telerik:RibbonBarTab Text="first tab">
                <telerik:RibbonBarGroup Text="Status Filter">
                    <Items>
                        <telerik:RibbonBarToggleList>
                            <ToggleButtons>
                                <telerik:RibbonBarToggleButton Value="StatusFilterAll" Size="Medium" Text="All" Toggled="true" />
                                <telerik:RibbonBarToggleButton Value="StatusFilterOpen" Size="Medium" Text="Open" />
                                <telerik:RibbonBarToggleButton Value="StatusFilterInProgress" Size="Medium" Text="In Progress" />
                                <telerik:RibbonBarToggleButton Value="StatusFilteronHold" Size="Medium" Text="On Hold" />
                                <telerik:RibbonBarToggleButton Value="StatusFilterClosed" Size="Medium" Text="Closed" />
                                <telerik:RibbonBarToggleButton Value="StatusFilterAllExClosed" Size="Medium" Text="All Except Closed" />
                            </ToggleButtons>
                        </telerik:RibbonBarToggleList>
                    </Items>
                </telerik:RibbonBarGroup>
            </telerik:RibbonBarTab>
        </Tabs>
    </telerik:RadRibbonBar>
    <asp:Button Text="select Closed" ID="btn1" OnClientClick="setToggledButton(); return false;" runat="server" />
    <script>
        function setToggledButton() {
            var ServiceDeskRibbonbar = $find("RadRibbonBar1");
            var targetBtn = ServiceDeskRibbonbar.findToggleButtonByValue("StatusFilterClosed");
            if (!targetBtn.get_toggled()) {
                targetBtn.get_element().click();
            }
        }
    </script>
    protected void RadRibbonBar1_ToggleListToggle(object sender, RibbonBarToggleListToggleEventArgs e)
    {
        Response.Write(e.ToggleButton.Text);
    }


    Regards,
    Marin Bratanov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top