2016-07-29 3 views
0

My Kendo ui drop down corupted в его внешнем виде В нем нет полосы прокрутки. Вот как я определяю и использовать его (с помощью angularJS)Kendo ui comboBox не прокручивается

HTML:

<kendo-combo-box 
ng-init="productFindCtrl.init()" 
    k-data-source="productFindCtrl.getProductsDS()" 
    k-data-text-field="'productId'" 
    k-data-value-field="'productId'" 
    k-min-length="3" 
    k-filter="'startswith'" 
    k-select="productFindCtrl.selectProduct" 
    style="width: 55%"> 
</kendo-combo-box> 

код Javascript (для контроллера)

controller: function($scope, $http){ 
     var instance = this; 

     this.init = function() {     
      $http.get("http://theUrlToResourceGoesHere?param=value").then(     
       function (response) { 
        //SUCCESS 
        console.log("SUCCESSFUL FOR PRODUCTS") ; 
        instance.products = response.data.products; 
        instance.metadata = response.data.metadata; 

        console.log("Products: "+instance.products) ;      
       }, 
       function (response) { 
        console.log("ERROR LOADING JSON DATA") ; 
       }); 

     }; //end of productFindCtrl.init() 

     //get productsDS 
     this.getProductsDS = function(){ 
      return instance.products; 
     } 
    }, 

В результате грязный падение вниз/выпадающий. Я получаю ту же проблему, пытаясь использовать либо виджет.

enter image description here

Но, когда я смотрю на образцы, они делают одни и те же вещи, и они имеют очень правильно выглядящие падение падения, и т.д ... Что здесь не так?

ответ

1

Это случилось со мной, и у меня были все необходимые CSS и т. Д. Я установил его, добавив:

.k-list-scroller { 
    position: relative; 
    overflow: auto; 
} 

в мой файл CSS.

Проблема заключается в том, что этот код не определен в kendo.common.css, который является файлом css по умолчанию, но определенным в kendo.common-material.css, который вы должны использовать, только если хотите использовать темы «Материал или материал черный».

+0

Спасибо. Это действительно сработало для меня, переопределяя стили .k-list-container. Я понял это путем «проверки» элементов. Я новичок со всей концепцией html5 и так, поэтому терминология была моей проблемой. –

1
  • Убедитесь, что JavaScript и CSS-файлы Kendo UI принадлежат к одной и той же версии.
  • Если это правда, попробуйте удалить стили CSS из не-Kendo на странице, чтобы проверить конфликты CSS.
  • Убедитесь, что страница имеет DOCTYPE, и браузер отображает ее в режиме стандартов, а не в режиме Quirks.