Kendo multiselect jQuery design issue

53 Views Asked by At

I have placed the kendo multiselect and trigeering the open event on page load as below.

var dropdown = $('#cont1').data("kendoMultiSelect"); dropdown.open();

when i resize the page or doing anything on the page only it shows popup of the kendo multiselect. why its behave like that

Kindly provide me the solution to make the mulitiselect as responsive.

  $("#cont1").kendoMultiSelect({
        //open: function (e) {
    
        close: function (e) {
            e.preventDefault(false);
        },

        itemTemplate: "<input type='checkbox'/>&nbsp; #:data.NAME#",
        headerTemplate: "<div class='ddAll' id='ddAll1'><input type='checkbox' id='HeaderCom'><label id='lblHeaderCom'> All</label></div>",
        dataTextField: "NAME",
        dataValueField: "ID",
        dataSource: {
            type: "JSON",
            serverFiltering: true,
            data: eval(daly)
        },

        filter: "contains",
        autoClose: false,       
        downArrow: true,
        tagMode: "single",
        tagTemplate: 'Com &nbsp;&nbsp; <span class="ddCircle">&nbsp; #:values.length# &nbsp;</span>',
        dataBound: function () {
            var items = this.ul.find("li");
            setTimeout(function () {
                checkInputs(items);
            });
        },
        change: function () {
            var items = this.ul.find("li");
            checkInputs(items);

            onchangeCompany();
        }
        
    });

enter image description here

1

There are 1 best solutions below

0
chandru arya On BEST ANSWER
 setTimeout(function () {
        $(window).trigger('resize');
    }, 200)