Skip to Content

Uncaught Error: Date must be a JavaScript date object; Element sap.m.PlanningCalendar#PC1

var date = new Date("2017", "9", "15", "8", "0"); var oModel = new sap.ui.model.json.JSONModel(); var data = 0;

$.ajax({

url:"/altcal/hana/wfs/services/getRosterInJSON.xsjs",

async:false,

type:'Get',

dataType:'json',

success: function(response) {

data = response;

oModel.setData(data);

console.log("view_Shift",data);

sap.ui.getCore().byId("PC1").setStartDate(new Date(data.startDate));

var len = data.people.length; for(i=0;i<len;i++) { sap.ui.getCore().byId("PC2").setIcon(data.people[i].pic); sap.ui.getCore().byId("PC2").setTitle(data.people[i].name);

var length =data.people[i].appointments.length;

for (j=0; i<length;i++) {

sap.ui.getCore().byId("PC3").setStartDate(new Date(data.people[i].appointments[j].start)); sap.ui.getCore().byId("PC3").setEndDate(new Date(data.people[i].appointments[j].end)); sap.ui.getCore().byId("PC3").setIcon(data.people[i].appointments[j].pic);

var dateFormat = sap.ui.core.format.DateFormat.getDateInstance({pattern : "yyyy-MM-dd" });

var start_date = data.people[i].appointments[j].start;

var startdate1 = new Date(start_date);

var startdate = dateFormat.format(startdate1);

var end_date = data.people[i].appointments[j].end;

var enddate1 = new Date(end_date);

var enddate = dateFormat.format(enddate1);

sap.ui.getCore().byId("PC3").setTitle(data.people[i].appointments[j].title); sap.ui.getCore().byId("PC3").setText(data.people[i].appointments[j].info); sap.ui.getCore().byId("PC3").setType(data.people[i].appointments[j].type); sap.ui.getCore().byId("PC3").setTentative(data.people[i].appointments[j].tentative); } } }

});

this.getView().setModel(oModel)

JSON is :

{ "startDate": "2017-08-01T00:00:00.000Z", "people": [{ "pic": "sap-icon://employee", "name": "James Smith", "appointments": [{ "start": "2017-08-01T22:30:00.000Z", "end": "2017-08-01T07:30:00.000Z", "title": "C1", "info": "NIGHT", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-02T22:30:00.000Z", "end": "2017-08-02T07:30:00.000Z", "title": "C1", "info": "NIGHT", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-03T22:30:00.000Z", "end": "2017-08-03T07:30:00.000Z", "title": "C1", "info": "NIGHT", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-04T22:30:00.000Z", "end": "2017-08-04T07:30:00.000Z", "title": "C1", "info": "NIGHT", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-05T07:00:00.000Z", "end": "2017-08-05T16:00:00.000Z", "title": "A1", "info": "MORNING", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-06T00:00:00.000Z", "end": "2017-08-06T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-07T00:00:00.000Z", "end": "2017-08-07T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-08T07:00:00.000Z", "end": "2017-08-08T16:00:00.000Z", "title": "A1", "info": "MORNING", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-09T07:00:00.000Z", "end": "2017-08-09T16:00:00.000Z", "title": "A1", "info": "MORNING", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-10T07:00:00.000Z", "end": "2017-08-10T16:00:00.000Z", "title": "A1", "info": "MORNING", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-11T07:00:00.000Z", "end": "2017-08-11T16:00:00.000Z", "title": "A1", "info": "MORNING", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-12T22:30:00.000Z", "end": "2017-08-12T07:30:00.000Z", "title": "C1", "info": "NIGHT", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-13T00:00:00.000Z", "end": "2017-08-13T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-14T00:00:00.000Z", "end": "2017-08-14T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }], "headers": [{ "start": "2017-08-01T22:30:00.000Z", "end": "2017-08-01T07:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-02T22:30:00.000Z", "end": "2017-08-02T07:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-03T22:30:00.000Z", "end": "2017-08-03T07:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-04T22:30:00.000Z", "end": "2017-08-04T07:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-05T07:00:00.000Z", "end": "2017-08-05T16:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-06T00:00:00.000Z", "end": "2017-08-06T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-07T00:00:00.000Z", "end": "2017-08-07T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-08T07:00:00.000Z", "end": "2017-08-08T16:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-09T07:00:00.000Z", "end": "2017-08-09T16:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-10T07:00:00.000Z", "end": "2017-08-10T16:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-11T07:00:00.000Z", "end": "2017-08-11T16:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-12T22:30:00.000Z", "end": "2017-08-12T07:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-13T00:00:00.000Z", "end": "2017-08-13T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-14T00:00:00.000Z", "end": "2017-08-14T00:00:00.000Z", "title": "Private", "type": "Type05" }] }, { "pic": "sap-icon://employee", "name": "Joanne Rush", "appointments": [{ "start": "2017-08-01T13:30:00.000Z", "end": "2017-08-01T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-02T13:30:00.000Z", "end": "2017-08-02T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-03T13:30:00.000Z", "end": "2017-08-03T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-04T13:30:00.000Z", "end": "2017-08-04T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-05T13:30:00.000Z", "end": "2017-08-05T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-06T00:00:00.000Z", "end": "2017-08-06T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-07T00:00:00.000Z", "end": "2017-08-07T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-08T13:30:00.000Z", "end": "2017-08-08T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-09T13:30:00.000Z", "end": "2017-08-09T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-10T13:30:00.000Z", "end": "2017-08-10T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-11T13:30:00.000Z", "end": "2017-08-11T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-12T13:30:00.000Z", "end": "2017-08-12T22:30:00.000Z", "title": "B2", "info": "AFTERNOON", "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-13T00:00:00.000Z", "end": "2017-08-13T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }, { "start": "2017-08-14T00:00:00.000Z", "end": "2017-08-14T00:00:00.000Z", "title": "WO", "info": null, "type": "Type01", "pic": "sap-icon://sap-ui5", "tentative": false }], "headers": [{ "start": "2017-08-01T13:30:00.000Z", "end": "2017-08-01T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-02T13:30:00.000Z", "end": "2017-08-02T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-03T13:30:00.000Z", "end": "2017-08-03T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-04T13:30:00.000Z", "end": "2017-08-04T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-05T13:30:00.000Z", "end": "2017-08-05T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-06T00:00:00.000Z", "end": "2017-08-06T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-07T00:00:00.000Z", "end": "2017-08-07T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-08T13:30:00.000Z", "end": "2017-08-08T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-09T13:30:00.000Z", "end": "2017-08-09T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-10T13:30:00.000Z", "end": "2017-08-10T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-11T13:30:00.000Z", "end": "2017-08-11T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-12T13:30:00.000Z", "end": "2017-08-12T22:30:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-13T00:00:00.000Z", "end": "2017-08-13T00:00:00.000Z", "title": "Private", "type": "Type05" }, { "start": "2017-08-14T00:00:00.000Z", "end": "2017-08-14T00:00:00.000Z", "title": "Private", "type": "Type05" }] }] }

OUTPUT:

Uncaught Error: Date must be a JavaScript date object; Element sap.m.PlanningCalendar#PC1 at f.e.setStartDate (PlanningCalendar.js?eval:6) at f.j.updateProperty (ManagedObject-dbg.js:3005) at f.w (ManagedObject-dbg.js:2853) at f.a.fireEvent (EventProvider-dbg.js:229) at f.B._fireChange (Binding-dbg.js:247) at f.J.checkUpdate (JSONPropertyBinding.js?eval:6) at f.B.initialize (Binding-dbg.js:373) at f.j._bindProperty (ManagedObject-dbg.js:2954) at f.j.updateBindings (ManagedObject-dbg.js:3618) at f.j._propagateProperties (ManagedObject-dbg.js:4030)

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Aug 24, 2017 at 02:12 PM

    As I see, are you trying to read the date from JSON and map it into a model. When you bind the model to control, you get the error. Is the interpretation correct?

    Note: Kindly explain the issue in detail and post relevant portion of code. It increases your chances of getting response.

    Add comment
    10|10000 characters needed characters exceeded

  • Aug 24, 2017 at 11:35 AM

    Hi Preeti,

    Change the JSON Object as below

    "start": new Date("2017-08-13T00:00:00.000Z"), "end":new Date( "2017-08-13T00:00:00.000Z"), "title": "Private", "type": "Type05" },

    This would work

    Regards,

    Shekar.

    Add comment
    10|10000 characters needed characters exceeded

  • Aug 17 at 09:29 AM

    Finally I got the solution:

    I tried this one and it is working properly.

    VIEW : -

    <PlanningCalendar

    id="PC1"

    singleSelection="false"

    showIntervalHeaders="false"

    startDate="{path: '/startDate'}"

    rows="{path: '/people'}"

    appointmentsVisualization="Filled"

    appointmentSelect="handleAppointmentSelect"

    intervalSelect="handleIntervalSelect">

    <rows>

    <PlanningCalendarRow

    id ="PC2"

    icon="{pic}"

    title="{name}"

    text="{role} ({level}) "

    key = "{empid}"

    appointments="{path : 'appointments', templateShareable: 'true'}">

    <appointments>

    <unified:CalendarAppointment

    startDate="{start}"

    endDate="{end}"

    icon="{pic}"

    title="{title}"

    text="{info}"

    type="{type}"

    color = "{color}"

    tentative="{tentative}">

    </unified:CalendarAppointment>

    </appointments>

    <intervalHeaders>

    <unified:CalendarAppointment

    startDate="{start}"

    endDate="{end}"

    icon="{pic}"

    title="{title}"

    type="{type}">

    </unified:CalendarAppointment>

    </intervalHeaders>

    </PlanningCalendarRow>

    </rows>

    </PlanningCalendar>

    CONTROLLER : -

    onInit: function () {

    var data = 0;

    var oModel = new sap.ui.model.json.JSONModel();

    $.ajax({

    url:"/altcal/hana/wfs/services/getRosterInJSON.xsjs",

    async:false,

    type:'Get',

    dataType:'json',

    success: function(response) {

    data = response;

    var data1 = {};

    var yr = new Date(data.startDate).getFullYear();

    var mnt = new Date(data.startDate).getMonth();

    var day = new Date(data.startDate).getDate();

    data1["startDate"] = new Date(yr,mnt,day);

    data1["people"] = data["people"];

    for(var pIndex in data["people"]) {

    for (var aIndex in data["people"][pIndex]["appointments"] ) {

    data1["people"][pIndex]["appointments"][aIndex]["start"]= new Date(data1["people"][pIndex]["appointments"][aIndex]["start"]);

    data1["people"][pIndex]["appointments"][aIndex]["end"]= new Date(data1["people"][pIndex]["appointments"][aIndex]["end"]);

    console.log() ;

    data1["people"][pIndex]["headers"][aIndex]["start"]= new Date(data1["people"][pIndex]["headers"][aIndex]["start"]);

    data1["people"][pIndex]["headers"][aIndex]["end"]= new Date(data1["people"][pIndex]["headers"][aIndex]["end"]);

    }

    }

    oModel.setData(data1); console.log("view_Shift",data1); } }); this.getView().setModel(oModel);

    },

    Add comment
    10|10000 characters needed characters exceeded