Matt
Matt

Reputation: 6953

jQuery Mobile with DHtmlXScheduler.. data not loading

I am trying to use the mobile version of DHtmlXScheduler. It runs fine, but I can't get it to load the data. I have tried both XML and Json. Here is the link to the documentation: http://docs.dhtmlx.com/doku.php?id=dhtmlxscheduler:mobile_data

Here is my code:

<div data-role="page" data-theme="d" id="Top">
    <script src="~/Scripts/dhxscheduler_mobile.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="~/Styles/dhxscheduler_mobile.css">

    <div data-role="content">
        <script type="text/javascript">
            scheduler.config.readonly = true;
            dhx.ready(function () {
                dhx.ui.fullScreen();
                dhx.ui({
                    view: "scheduler",
                    id: "scheduler"
                });
            });
            $("scheduler").parse([
                    { id: 1, start_date: "2013-04-01 0:00", end_date: "2013-04-01 0:00", text: "Event 1" },
                    { id: 2, start_date: "2013-04-05 0:00", end_date: "2013-04-05 0:00", text: "Event 2" }
            ], "json");
        </script>
    </div>
</div>

What am I doing wrong here?

Upvotes: 1

Views: 1180

Answers (1)

Jaya Mayu
Jaya Mayu

Reputation: 17247

I went through the documentation and there should be two $$ when parsing the events. so chagne as follows

$$("scheduler").parse([
                    { id: 1, start_date: "2013-04-05 0:00", end_date: "2013-04-05 12:00", text: "Event 1" },
                    { id: 2, start_date: "2013-04-05 0:00", end_date: "2013-04-05 1:00", text: "Event 2" }
            ], "json");

putting it all together something as below

<div data-role="page" data-theme="d" id="Top">
    <link rel="stylesheet" type="text/css" href="codebase/dhxscheduler_mobile.css">
    <script src="codebase/dhxscheduler_mobile.js" type="text/javascript"></script>

    <div data-role="content">
        <script type="text/javascript">
        scheduler.config.readonly = true;
                dhx.ready(function(){
                    //the method allows you to hide the address bar on iPhone/iPod to save the space for application
                    dhx.ui.fullScreen();
                    //object constructor
                    dhx.ui({
                        view: "scheduler",
                    id: "scheduler"
                    });
                    // method load() lets you to populate the scheduler with data
                    $$("scheduler").parse([
                    { id: 1, start_date: "2013-04-05 0:00", end_date: "2013-04-05 12:00", text: "Event 1" },
                    { id: 2, start_date: "2013-04-05 0:00", end_date: "2013-04-05 1:00", text: "Event 2" }
            ], "json");

                });

        </script>
    </div>
</div>

Screen shot

enter image description here

Upvotes: 1

Related Questions