0

I am trying to use zebra datepicker library in my project. I have followed the instructions here and written the following codes:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="assets/js/jquery-1.8.3.min.js"></script>

<script type="text/javascript" src="assets/Zebra_Datepicker-master/public/javascript/zebra_datepicker.js"></script>
<link rel="stylesheet" href="assets/Zebra_Datepicker-master/public/css/metallic.css" type="text/css"></link>

<script type="text/javascript">
window.onload = function(){
    $('#calendarValue').Zebra_DatePicker();

}
</script>

</head>

<body>
<div id="calendarContainer">
<input type="text" id="calendarValue"></input>
</div>

</body>
</html>

This results into a yellow icon attached to a text field with the id 'calendarValue', and the icon loads a calendar when gets clicked. I am getting the expected result in chrome, firefox and internet explorer 10 and 11.

While it is mentioned by the developer (Stefan Gabos) of zebra, that following strict doctype () makes it compatible with IE6+, and the example html's in zebra datepicker package also works fine to load the datepicker on IE9 particularly, my codes does not load the datepicker UI when I test it on IE 9; only the yellow icon gets attached to the text box and the calendar UI does not open when the button is clicked. It can be seen I did use doctype in my code so it should have been a problem to get the UI with old versions of IE, but that is not so in my case. Screenshots are given below: Yellow Icon attached to the Text Field Click on the icon brings the UI, which is not happening on IE9

I am a noob in web developing, and I cant figure out what is wrong here.

Hope everything is explained in detail this time.

fs71gh
  • 63
  • 2
  • 7
  • IE9 has some issues with event triggers failing silently: http://stackoverflow.com/questions/10961430/ie9-not-running-javascript-onload Beyond that, could you test yourself and provide details about exactly whats going on? – blgt Mar 15 '16 at 09:45
  • I have used zebra datepicker in a project and its pages are not loaded completely when tested with IE9. With these simple lines of code, I tried to see if zebra picker is really not working on IE or it was my code that did not work. I just wanted to initiate a zebra datepicker in the "calendarValue" text field which is failing for IE9. – fs71gh Mar 15 '16 at 10:22
  • Just have edited my question. I hope my problem is clear now. – fs71gh Mar 15 '16 at 14:32

1 Answers1

1

Actually the problem was my company has policy to render intranet sites in compatibility view in IE which was causing troubles here. I used edge meta tag:

<meta http-equiv="X-UA-Compatible" content="IE=EDGE">

which is forcing my site to load in default standard mode in IE and fixed my issue.

Hope it would help noob people like me in the dark

fs71gh
  • 63
  • 2
  • 7