A DEv
A DEv

Reputation: 340

Kendo Dropdown closes when we click to open it in IE browser

I am using Kendo UI v2018.1.221 in my page, whenever I click the dropdown to open it just opens and showing options and closes suddently before I make a selection. It uses serverfiltering as well. I googled this a lot, but not finding any solutions for this. sample code:

 <table>
<TR>
    <TD ALIGN="left" >Company:</TD>
    <TD ALIGN="left" >
        <select class="form-control" style="width: 80%" name="teamID" id="company">

        </select>
   </TD>
</TR>

<script>
var dropdown = $("#company").kendoDropDownList({
            dataTextField: "name",
            dataValueField: "id",
            filter: 'contains',
            optionLabel: 'Select a Company',
            enable: true,
            scrollable: {
                virtual: true
            },
            virtual: {
                itemHeight: 26
            },
            dataSource: {
                type: "odata",
                transport: {
                    read: {
                        dataType: "json",
                        url: "#url#"
                    }
                },
                batch: true,
                pageSize: 80,
                serverPaging: true,
                serverFiltering: true,
                schema: {
                    data: "data",
                    total: 'recordsTotal',
                    model: {
                        id: 'teamid',
                        fields: {
                            id: {
                                type: 'number'
                            },
                            name: {
                                type: 'string'
                            }
                        }
                    }
                }
            }

        }).data("kendoDropDownList");
</script>

Upvotes: 1

Views: 2306

Answers (3)

javdromero
javdromero

Reputation: 1937

I have this problem even with the 2024 kendo's version, you should tell the document that on modals you should attach to the modal itself

popup: {
    appendTo: $("#modalId")
}

Upvotes: 0

Natalka
Natalka

Reputation: 438

You need to take the focus away from the modal. You could do this on the open event.

  open: function(e) {
     $(document).off('focusin.bs.modal');
  }

Upvotes: 3

BurnsBA
BurnsBA

Reputation: 4939

This seems to be a problem with the filter. Removing the filter fixed the problem for me.

var dropdown = $("#company").kendoDropDownList({
    dataTextField: "name",
    dataValueField: "id",
    // filter: 'contains',
    optionLabel: 'Select a Company',
    enable: true,
    ...

Upvotes: 1

Related Questions