Display drop down menu on mouse over

2 posts, 0 answers
  1. Ryan
    Ryan avatar
    56 posts
    Member since:
    Apr 2012

    Posted 30 Apr 2012 Link to this post

    Hello,
         I have a combo-box which populates data using ajax. However i dont want all the data to be displayed. How can I hide an item from the list while populating.
    Also I want to display the drop down on mouse-over of the combo-box.
    Can anyone help me out :(
    Thanks
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 30 Apr 2012 Link to this post

    Hi Ryan,

    I suppose that you want to hide some items in the dropdown of RadComboBox and to show dropdrown on mouseover of the RadComboBox. Please try the following code.

    ASPX:
    <telerik:RadComboBox ID="RadComboBox1" runat="server" OnClientDropDownOpening="OnClientDropDownOpening" >
       <Items>
            <telerik:RadComboBoxItem Text="item1" />
            <telerik:RadComboBoxItem Text="item2" />
            <telerik:RadComboBoxItem Text="item3" />
            <telerik:RadComboBoxItem Text="item4" />
        </Items>
    </telerik:RadComboBox>

    C#:
    protected void Page_Load(object sender, EventArgs e)
        {
            RadComboBox1.Attributes.Add("onmouseover", "openDropdown()"); 
        }

    JS:
    <script type="text/javascript">
      function OnClientDropDownOpening(sender, args)
       {
            var item = sender.findItemByText("item3");
            item.hide();
       }
      function openDropdown(control)
       {
        var combo = $find("<%= RadComboBox1.ClientID %>"); 
        combo.showDropDown(); 
       
    </script>

    Thanks,
    Princy.
Back to Top