jQuery UI Widgets Forums Editors Calendar Special date from PHP, MySQL Date

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 9 years ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Special date from PHP, MySQL Date #72774

    jcaballero
    Participant

    Hi, I use this method to mark the special dates with Ajax, but the special dates shows me one day earlier.

    My HTML:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <title></title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script>
    <script type="text/javascript">
       $(document).ready(function () {
        
          $("#jqxWidget").jqxCalendar({ enableTooltips: true, width: 220, height: 220});
    
          $.ajax({
             dataType: 'json', 
             async: false, 
             cache: false, 
             url: 'dates.php',
             success: function (json){
               for (var i = 0; i < json.length; i++) {
                  var dates = json[i].dates;
                  var sliced = dates.slice(0, 10);
                  var d = new Date(sliced);
                  $("#jqxWidget").jqxCalendar('addSpecialDate', d, '', 'Special Date' + i);
               }
            },
            error: function (xhr) {
               $("#jqxWidget").html("Error "+ xhr.status + " " + xhr.statusText);
            }
         });
       
      });
    </script>
    
    </head>
    <body>
        <div id='jqxWidget'></div>
    </body>
    </html>

    My JSON Data from PHP:

    [{"dates":"2015-06-01 00:00:00"},{"dates":"2015-06-08 00:00:00"}]

    Special dates are shown in the widget as follows: 2015/05/31 and 2015/06/07. Not like my JSON sample.

    Any idea, what I’m doing wrong?

    Thank you very much for your help.

    Special date from PHP, MySQL Date #72808

    Dimitar
    Participant

    Hi jcaballero,

    This issue occurs because of time zone hour differences. If you change your for loop like this:

    for (var i = 0; i < json.length; i++) {
        var dates = json[i].dates;
        var year = parseInt(dates.slice(0, 4));
        var month = parseInt(dates.slice(5, 7)) - 1;
        var day = parseInt(dates.slice(8, 10));
        var d = new Date(year, month, day, 0, 0, 0);
        $("#jqxWidget").jqxCalendar('addSpecialDate', d, '', 'Special Date' + i);
    }

    the special dates should be shown correctly.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.