Datepicker under IE8

14 posts, 0 answers
  1. Marcus
    Marcus avatar
    18 posts
    Member since:
    Nov 2011

    Posted 07 Nov 2011 Link to this post

    Oh sorry please move to datepicker ...


    This is not running under IE8, the datepicker pictures are not there (so nothing to click)
    under FF 7 its working fine.

    <input id="datepickerF" value=""/>
    <input id="datepickerT" value=""/>


    $(document).ready(function() {
        $("#datepickerF").kendoDatePicker({
                            // defines the start view
                            startView: "year",

                            // defines when the calendar should return date
                            depth: "year",

                            // display month and year in the input
                            format: "MMMM yyyy",
                            change: function(){needChange=true;}
                        });
        $("#datepickerT").kendoDatePicker({
                            // defines the start view
                            startView: "year",

                            // defines when the calendar should return date
                            depth: "year",

                            // display month and year in the input
                            format: "MMMM yyyy",
                            change: function(){needChange=true;}
                        });
    ....
  2. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 08 Nov 2011 Link to this post

    Hi Marcus,

    The provided code snippet works correctly on my side. Please double-check for Javascript errors in IE8.

    Best wishes,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Marcus
    Marcus avatar
    18 posts
    Member since:
    Nov 2011

    Posted 08 Nov 2011 Link to this post

    Ok Thank you ...

    Yes I checked, no javascript error and for the tabs it seems like he found the css and so ...?

    But the tabs in the looks like this:


    In ff like this:



    So a complete different look ....

    Marcus











  5. Marcus
    Marcus avatar
    18 posts
    Member since:
    Nov 2011

    Posted 08 Nov 2011 Link to this post

    Solved

    If I include the example.min.css than it works!! (css flatter effect)

    Marcus
  6. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 09 Nov 2011 Link to this post

    Hello Marcus,

    I am not sure this is a solution, because it is still not clear why this file is required. If I were you, I would investigate exactly which CSS rule from the examples CSS matters.

    I suspect that you have stumbled upon an IE rendering bug and some hasLayout-related CSS rule in the examples CSS fixes it.

    Regards,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Marcus
    Marcus avatar
    18 posts
    Member since:
    Nov 2011

    Posted 11 Nov 2011 Link to this post

    Hi

    Thats right ... you absolutly right ...

    The code is orignialy from you I dont change it ...

    Marcus
  8. Corey Gaudin
    Corey Gaudin avatar
    57 posts
    Member since:
    Nov 2009

    Posted 14 Dec 2011 Link to this post

    It appears adding jquery ui css to a page with kendo ui on IE 8 completely blows up the date picker and combobox etc. There must be some CSS property in jquery ui that is forcing problems. I placed Kendo UI's css after jquery UI's but it makes no difference.
  9. Kavitha
    Kavitha avatar
    3 posts
    Member since:
    Dec 2011

    Posted 14 Dec 2011 Link to this post

    I did include example.css in file.  But I am still haviing issues.

    I could not find the min version of the file though. It should not make any difference if I use the min version or not.
  10. Corey Gaudin
    Corey Gaudin avatar
    57 posts
    Member since:
    Nov 2009

    Posted 14 Dec 2011 Link to this post

    Alright, after playing with this, jquery UI css has nothing to do with it. It is caused by any of the Tabs or Panels (Kendo included)! It seems as through the Combobox and DatePicker do not react correctly in IE 8 when placed in a tab. If you simplify where there is a tab and only the datepicker, it seems to work, but with FieldSets and varying divs it appears to not work.

    Can you check this and verify it is an error.
  11. Corey Gaudin
    Corey Gaudin avatar
    57 posts
    Member since:
    Nov 2009

    Posted 14 Dec 2011 Link to this post

    Figured out the problem with Datepicker and ComboBox not working (not closing correctly) in IE 8.

    You must add the CSS: 
    html {
        overflow-y: scroll;
    }

    I stumbled on this from a previous poster saying that example.css fixed his problem and just drilled down each element until it broke again. This was the trick to making the DatePicker open/close correctly (as well as the ComboBox) in IE 8.

    UPDATE:
    Unfortunately, this breaks more than it fixes ... with my page not reacting right when I have a long list to show (the scroll bars don't show correctly to scroll down). Any ideas on how to fix this with IE 8? It works with every other version (IE7, IE9, Chrome, FF).

    UPDATE 2:
    Nevermind, apparently I copied over your height for html also from example.css which was completely messing up the vertical scroll bar. After removing the below css rule, everything works as expected.

    html { 
         height: 100%;
    }

  12. Kavitha
    Kavitha avatar
    3 posts
    Member since:
    Dec 2011

    Posted 14 Dec 2011 Link to this post

    But it is already there in example.css. This is the snippet already present there. from 24 - 28 line

    html
    {
        overflow-y:scroll;
        font:75% arial,helvetica,sans-serif;
    }

    when I close the app it shows that it has a script error and points to 

    (document).ready(function(){jQuery(".best_in_place").best_in_place()});

    I do not have this line of code anywhere in my code.
  13. Corey Gaudin
    Corey Gaudin avatar
    57 posts
    Member since:
    Nov 2009

    Posted 14 Dec 2011 Link to this post

    Right,

    But do you really want all of those extra styles for your own custom Web Application when it is only one rule that is making this work?
  14. Kavitha
    Kavitha avatar
    3 posts
    Member since:
    Dec 2011

    Posted 14 Dec 2011 Link to this post

    further it also says   Object doesn't support this property or method and points to this line

    (document).ready(function(){jQuery(".best_in_place").best_in_place()});

    I do not have this in my code.
  15. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 15 Dec 2011 Link to this post

    Hi all,

    All the information provided already is not very clear for me to reproduce the problem with the DatePicker. If anyone provides a runnable HTML page, I will take a look.

    With regard to the "best in place" method, we don't have that either.

    Kind regards,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready