RadComboBox reopens dropdown after selecting item on IE

[Osman]

I'm using a RadComboBox to create a search in my page. When the page is loaded the control do not have items preloaded. This is done after you type some letters, the values are retrieved from a table based on your search and then the combo drops down showing the values returned, so the user can select an option.

Some of these values retrieved from the table can contain non-us letters (spanish/french/portuguese characters like Ñ or Ó, for instance).

The issue is, after selecting one of these values with non-us characters, the combo drops down and populate the list again. This stops only if you press ESC.

I'm not sure exactly which version we use. The Telerik.Web.UI (and others) dll version is: 2012.1.215.40

This happens only on IE.

Chrome, FF and Edge are OK.

I appreciate any help you can provide. Thanks in advance.

 

Note: It's very similar to this case: https://www.telerik.com/forums/radcombobox-is-not-closing-in-ie11-after-filtering-it-remains-opened-always

[Surendra]

Hi,

I have same problem, Can you please help me on this?

I have radcombobox with special characters like "Tollhouse Cookies 新業務分店" , when i select this item then drop down is reopening automatically.

 

[Marin Bratanov]

Hi,

I would first encourage you to check this article for IE-specific issues: https://www.telerik.com/support/kb/aspnet-ajax/details/problem-in-ie-works-fine-in-other-browsers.

Then, the following works fine for me with the latest version (R3 2018 at the time of writing) and so you can compare against the problematic code to see what is the difference causing the issue:

<telerik:RadComboBox runat="server" ID="rcb1" RenderMode="Lightweight">
    <Items>
        <telerik:RadComboBoxItem Text="first" />
        <telerik:RadComboBoxItem Text="Tollhouse Cookies 新業務分店" />
        <telerik:RadComboBoxItem Text="third" />
    </Items>
</telerik:RadComboBox>

So, I advise that you upgrade to it and see if the issue is resolved. If not, I would encourage you to open a support ticket and send us an MCVE of the problem so we can investigate it.

Regards,
Marin Bratanov
Progress Telerik

[Surendra]

Hi Marin,

  Please find the below sample code. I am using "2013.1.507.45" telerik version and in IE 11 browser. 

Issue is: When i select "Tollhouse Cookies 新業務分店" item from combo box then combo box is reopening automatically. If we remove update panel then it is working fine.

In aspx file:

<asp:UpdatePanel ID="upd" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    Rad Combobox Demo:
            <telerik:RadComboBox
                ID="RadComboBox1"
                runat="server"
                EnableLoadOnDemand="True"
                Width="189px"
                AutoPostBack="true"
                MaxHeight="250"
                RenderMode="Lightweight"
                EnableVirtualScrolling="true"                               
                OnItemsRequested="RadComboBox1_ItemsRequested">
            </telerik:RadComboBox>

                </ContentTemplate>
            </asp:UpdatePanel>

In Code behind file:

Protected Sub RadComboBox1_ItemsRequested(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs)
        Dim combo As RadComboBox = TryCast(sender, RadComboBox)
        combo.Items.Add(New RadComboBoxItem("Item1", "1"))
        combo.Items.Add(New RadComboBoxItem("Item2", "2"))
        combo.Items.Add(New RadComboBoxItem("Tollhouse Cookies 新業務分店", "3"))
    End Sub

It is urgent, Can you please help me on this.

Thanks,

Surendra.

[Marin Bratanov]

Hi Surendra,

My best advice is to upgrade to the latest version of our controls, because your version does not support IE11 because it was released in the Autumn of 2013, about half a year after the version you are using, and there may have been some bug that was fixed in later versions.

The only other idea I can offer is that you close the dropdown when selecting an item:

<asp:UpdatePanel ID="upd" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        Rad Combobox Demo:
    <telerik:RadComboBox
        ID="RadComboBox1"
        runat="server"
        EnableLoadOnDemand="True"
        Width="189px"
        AutoPostBack="true"
        MaxHeight="250"
        RenderMode="Lightweight"
        EnableVirtualScrolling="true"
        OnItemsRequested="RadComboBox1_ItemsRequested"
        OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged">
    </telerik:RadComboBox>

    </ContentTemplate>
</asp:UpdatePanel>
<script>
    function hideComboDropDown() {
        $find("<%=RadComboBox1.ClientID%>").hideDropDown();
        Sys.Application.remove_load(hideComboDropDown);
    }
</script>

Protected Sub RadComboBox1_SelectedIndexChanged(sender As Object, e As RadComboBoxSelectedIndexChangedEventArgs)
    ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", "Sys.Application.add_load(hideComboDropDown);", True)
End Sub

Protected Sub RadComboBox1_ItemsRequested(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs)
    Dim combo As RadComboBox = TryCast(sender, RadComboBox)
    combo.Items.Add(New RadComboBoxItem("Item1", "1"))
    combo.Items.Add(New RadComboBoxItem("Item2", "2"))
    combo.Items.Add(New RadComboBoxItem("Tollhouse Cookies 新業務分店", "3"))
End Sub

Regards,
Marin Bratanov
Progress Telerik

[Surendra]

Hi Marin Bratanov,

Thank you for your help.

We have one requirement with kendo-multiselect in our project, where we are grouping the records with check boxes. we are able to add check boxes for sub categories but could not able to add to category.

Please find in below link, where we have 2 categories meat and vegetables, our requirement is , we need to add check boxes for meat and vegetables. when user selects/deselects category like "Meat" then corresponding sub categories needs to be selected/deselected. Can you please help us on this to implement in our project.

https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/grouping/

 

[Marin Bratanov]

Hi Surendra,

I advise that you open a support ticket for the Kendo for Angular product and provide details of the problem you are facing, so the team working on the Angular components can review and advise.

Regards,
Marin Bratanov
Progress Telerik