dhtmlx-scheduler

DHTMLX Scheduler won't load data

DHTMLX Scheduler can't load data, even if it is inline in the html document. Here is my code:

<!doctype html>
<html>
  <head>
  <meta charset="utf-8">
   <script src="https://cdn.dhtmlx.com/scheduler/edge/dhtmlxscheduler.js"></script>
   <link href="https://cdn.dhtmlx.com/scheduler/edge/dhtmlxscheduler_material.css" 
        rel="stylesheet" type="text/css" charset="utf-8">
    <style>

        html, body{
            margin:0px;
            padding:0px;
            height:100%;
            overflow:hidden;
        }


    </style>
</head>
<body>
    <div id="scheduler_here" class="dhx_cal_container" 
        style='width:100%; height:100%;'>
        <div class="dhx_cal_navline">
            <div class="dhx_cal_prev_button">&nbsp;</div>
            <div class="dhx_cal_next_button">&nbsp;</div>
            <div class="dhx_cal_today_button"></div>
            <div class="dhx_cal_date"></div>
            <div class="dhx_cal_tab" name="day_tab"></div>
            <div class="dhx_cal_tab" name="week_tab"></div>
            <div class="dhx_cal_tab" name="month_tab"></div>
        </div>
        <div class="dhx_cal_header"></div>
        <div class="dhx_cal_data"></div>
    </div>
    <script>

        scheduler.init('scheduler_here', new Date(2019,0,20), "week");
        if (scheduler.parse([
            {text:"Meeting",    start_date:"15/01/2020 14:00", end_date:"15/01/2020 17:00"},
            {text:"Conference", start_date:"16/01/2020 12:00", end_date:"16/01/2020 19:00"},
            {text:"Interview",  start_date:"17/01/2020 09:00", end_date:"17/01/2020 10:00"}
                        ],"json")) {
            alert("OK");
          }
          else {
            alert("NOK")
          }

    </script>
</body>

See fiddle here:

https://jsfiddle.net/q9bhgj0s/

What do I miss???

Thanks!

Solution

  • The events you've passed to the scheduler's parse method are not rendering because the date format specified for the start_date and end_date properties is not being recognised.

    The following demonstrates the parse function using an acceptable format:

    scheduler.parse([
    {text:"Meeting",    start_date:"2019-01-15 14:00", end_date:"2019-01-15 17:00"},
    {text:"Conference", start_date:"2019-01-16 12:00", end_date:"2019-01-16 19:00"},
    {text:"Interview",  start_date:"2019-01-17 09:00", end_date:"2019-01-17 10:00"}
], "json");

    Updated Fiddle: https://jsfiddle.net/ChrisCookDev/frwynpds/

    In addition, please bear in mind that the scheduler's parse method does not return a Boolean result (as your code suggests with the reporting of "OK" and "NOK"):

    void parse(object data, [string type] );