Hide/Show SearchBox from javascript

3 posts, 0 answers
  1. Mickael
    Mickael avatar
    24 posts
    Member since:
    Oct 2014

    Posted 15 Oct 2014 Link to this post

    Hi,

    I am trying to toggle the visibility of a searchbox on my page using a button.
    but for some reason the searchbox never disappear.

    <asp:ImageButton
        ImageUrl="Images/zoom-search-2-icon.png"
        AlternateText="Search"
        ToolTip="Search"
        Height="32"
        Width="32"
        runat="server"
        CssClass="iconImageStyle"
        OnClientClick="Search_Click()" />
     
    <telerik:RadSearchBox
        ID="CmbBx_Search"
        runat="server"
        Width="550px"
        EmptyMessage="Search..."
        OnClientSearch="PerformSearch"
        ShowSearchButton="true">
        <DropDownSettings Height="400" Width="300" />
        <WebServiceSettings Path="Main.aspx" Method="GetResults" />
    </telerik:RadSearchBox>
     
    <script type='text/javascript'>
        function Search_Click() {
            toggle_visibility('CmbBx_Search');
        }
     
        function toggle_visibility(id) {
            var e = document.getElementById(id);
            if (e.style.display == 'block')
                e.style.display = 'none';
            else
                e.style.display = 'block';
        }
    </script>

    From the code behind if I change the Visibility, it works.
    But I do not want to do this from the code behind. I need to do it from client-side javascript.
  2. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1266 posts

    Posted 16 Oct 2014 Link to this post

    Hello,

    You could use the following implementation of the toggle_visibility function:
    function toggle_visibility(id) {
       $telerik.$("#"+ id).toggle();
     }


    Regards,
    Dimitar Terziev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mickael
    Mickael avatar
    24 posts
    Member since:
    Oct 2014

    Posted 16 Oct 2014 in reply to Dimitar Terziev Link to this post

    Even with your code I could not get it to work, so I investigated the page behaviour instead.
    In the end I had to switch from the asp:ImageButton to a simple 'img' with a 'onclick' because what happened was that the ImageButton was doing a postback and thus cancelling the visilibity toggle.

    Thanks for your help.
Back to Top