This is a migrated thread and some comments may be shown as answers.

IE10/IE11 Kendo Date Picker Problem

1 Answer 292 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Cedric asked on 25 Mar 2014, 02:18 PM

kendo_calendar_popup_ie10-11_problem.png

Hello,

We’re experiencing a problem on IE10 and 11 concerning the date picker calendar popup. The calendar popup immediately closes when the mouse moves out from the calendar button.

The date picker is part of a grid filter.

The kendo UI Grid is configured for Ajax Binding which generates the filter code.

The calendar popup behaves as expected when tested on IE9, Chrome and Firefox.

Calendar Popup Html Snippet

<div class="k-animation-container" style=

"left: 6.5px; top: 86.72px; width: 207px; height: 239px; overflow: hidden; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-left: 0px; display: none; position: absolute; z-index: 10002;"

><br><br> <div

class="k-calendar-container<br>k-popup k-group k-reset" aria-hidden="true" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: none; position: absolute; font-stretch: normal; transform: translateY(-239px);' data-role="popup"><

br><br> <div class="k-widget k-calendar" id="7a220a39-81a2-4e85-a966-be5a672dcb3e" data-role="calendar"><br><br> <div class="k-header"><a class="k-link k-nav-prev" role="button" aria-disabled="false" href="#"><span class="k-icon<br>k-i-arrow-w"></span></a><a

class="k-link<br>k-nav-fast" role="button" aria-disabled="false" aria-live="assertive" aria-atomic="true" href="#">March 2014</

a><a class="k-link k-nav-next" role="button" aria-disabled="false" href="#"><span class="k-icon<br>k-i-arrow-e"></span></a></div>

Date Picker HTML Snippet

<div

class="k-column-menu k-popup<br>k-group k-reset k-state-border-up" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: block; position: absolute; font-stretch: normal; transform: translateY(0px);' data-role="popup"><

br><br> <ul tabindex="0" class="k-widget k-reset k-header<br>k-menu k-menu-vertical" role="menubar" data-role="menu"><br><br> <li class="k-item k-columns-item<br>k-state-default k-first" role="menuitem" style="z-index: auto;"><br><br> <span class="k-link"><span class="k-sprite<br>k-i-columns"></span>Display/Hide<span class="k-icon<br>k-i-arrow-e"></span></span><br><br> <div class="k-animation-container" style=

"left: 173px; top: 0px; width: 221px; height: 200px; overflow: hidden; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-left: 0px; display: none; position: absolute; z-index: 10002;"

><br><br> <ul

class="k-group k-popup<br>k-reset" role="menu" style='line-height: normal; font-family: "Segoe UI", "Arial"; font-size: 13px; font-style: normal; font-weight: 400; display: none; position: absolute; font-stretch: normal; transform: translateX(-221px);' data-role="popup"><

br><br> <li class="k-item k-state-default<br>k-first" role="menuitem"><span class="k-link"><input type="checkbox" data-field="BClassDescription" data-index="0">B Class</span></li><br><br> <li class="k-item<br>k-state-default" role="menuitem"><span class="k-link"><input type="checkbox" data-field="BLogicalName" data-index="1">Name</span></li>

Any help would be much appreciated. Thank you.

IE10/IE11 Kendo Date Picker Problem

1 Answer, 1 is accepted