Sayfada Kendo Açılır Listesinin Çöküşü Nasıl Önlenir Javascript kullanarak ilerleyin?

Question

Garip bir sorunla karşı karşıyayım ve 3 çözüm uygulamaya çalıştım ama benim için çalışmadı.

Sorun, dış sayfa kaydırmada kendo açılanmasının varsayılan işlevidir. Çöküşü önlemek ve bazı araştırmalar yapmak istiyorum.

bunu önlemek için bir çözüm here var ama bu gösterilmektedir Önizleme bölümünde iyi çalışıyor ama aynı Dojo'nun (sağ üst bağlantı) altında ve reel projede çalışmıyor.

Ben Dojo'nun yılında Önizleme değil açılır çöküşüne engel olduğunu görebilirsiniz fark yoktur.

Lütfen, Kendo'da yeni başlayan biriyle aynı olanı çözmeme yardımcı olun.

Answer 1

Bu davranışı denetlemek için widget'ın close olayını ele almanız gerektiğine inanıyorum. Ben senin sınıf niteliklerini size avantaj böylece bu bağlayan

<input id="dropdownlist" /> 
    <script> 
     $("#dropdownlist").kendoDropDownList({ 
      dataSource: [ "text1", "text2" ], 
      close: _myClose.bind(this) 
     }); 

     var _myClose = function (e) { 
      var wish = true; 
      var element = e.sender; 
      if (wish) { 
       e.preventDefault(); 
      } 
     }; 
</script> 

: İşte bir örnek. İsterseniz kaldırabilirsiniz. Kendo widget'ının örneği e.sender nesnesinin altında kullanılabilir.

İşte bağlantı noktası Docs. Umut eder.

Answer 2

$(".k-list-container").each(function() { 
    var elementId = this.id.split("-")[0]; 
    var widget = $("#" + elementId).data("kendoDropDownList"); 
    if (widget) { 
     widget.ul.parent().on("wheel", function (e) { 
      var container = this; 
      if ((container.scrollTop == 0 && e.originalEvent.deltaY < 0) || 
       (container.scrollTop == container.scrollHeight - container.offsetHeight && e.originalEvent.deltaY > 0)) { 
       e.preventDefault(); 
       e.stopPropagation(); 
      } 
     }); 
    } 
}); 

Answer 3

Bir kendo dropdownlist açıktır ve fare liste seçenekleri üzerinde süpürdü gibi güvenilir sürece kaydırma sayfasını devre dışı bırakmak için bu basit pasajını buldum.

// Fix annoyance where entire page scrolls when you scroll to the bottom of a dropdown 
$(document).bind('mousewheel DOMMouseScroll', function (e) { 
    var kendoDropdownBoxes = $('.k-list-container[style*="display: block"]'); 
    if (kendoDropdownBoxes.length > 0 && kendoDropdownBoxes.is(':hover')) { 
     $("body").css("overflow", "hidden"); 
    } else { 
     $("body").css("overflow", "auto"); 
    } 
});