We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Why isnt Scheduler populated with appointments from my Mongodb server (using Mongoose)?

I am building a MEAN-application with Scheduler. Creating appointments and saving them to the mongodb database works flawlessly, hoewever, the schedulers remains empty while there are many appointments in the database. This is in my index.js


app.post("/GetData", (req, res) => {
Event.find({}, function(err, events) {
res.send(events);
});
});

I see in my Network tab in my browsers developer tools that when the Scheduler is loaded, the 'getData returns a '200 OK' with the request
Running the 'GetData' endpoint in postman gives me these documents:

 {
        "_id""5dc835d6wefw835250ab4456",
        "startTime""Tue Nov 12 2019 12:00:00 GMT+0100 (GMT+01:00)",
        "endTime""Tue Nov 12 2019 12:30:00 GMT+0100 (GMT+01:00)",
        "subject""Work",
        "klant""Simon",
        "km"43,
        "business"true,
        "location""Amsterdam",
        "description""test",
        "__v"0
    }

How does it come that I dont see the appointments in the scheduler?

22 Replies

YL Youssef Lakdime November 10, 2019 07:34 PM UTC

private dataManager: DataManager = new DataManager({
url: 'http://localhost:8000/GetData',
crudUrl: 'http://localhost:8000/BatchData',
adaptor: new UrlAdaptor
});

this is what I have as dataManager


VD Vinitha Devi Murugan Syncfusion Team November 11, 2019 12:24 PM UTC

 
Hi Youssef, 
 
Syncfusion Greetings. 
 
We have tested your shared code in which field mapping is incorrect, which is the root cause of the reported issue. We prepared the sample below with the right field mapping, please refer to it. 
 

 
Regards, 
M.Vinitha devi 



YT yasser taibi May 18, 2022 09:03 AM UTC

Hello

please can someone help me with the execution of the program gives me this time offset in the frontback part of the project but at the database it saves the exact times


img3.JPG

mongoDB 

img2.JPG





RV Ravikumar Venkatesan Syncfusion Team May 19, 2022 02:07 PM UTC

Hi Yasser,


Greetings from Syncfusion support.


We have validated your query based on your shared images and in your DB the appointment start and end times are stored in the UTC format. By default, while assigning this data to the Scheduler it automatically converts the start and end times of the appointment based on the System timezone. Because of that, the Scheduler appointments are rendered in the 11.


Ex: If you are in the UTC +3 Moscow timezone. If the appointment start time is May 19, 2022, at 9 AM in UTC. The Schedule automatically adds three hours to the appointment start time-based on the System's local timezone UTC +3 Moscow. So, the appointment was rendered on May 19, 2022, at 11 AM.


If you want the Schedule to render the appointment at the exact time that is stored in the DB can you kindly share the below details?

  • Are you using the Timezone property of the Schedule?
  • If yes can you share the Timezone property value?


Refer to the below UG for more details about working with Schedule Timezone.

https://ej2.syncfusion.com/angular/documentation/schedule/timezone/


Regards,

Ravikumar Venkatesan



YT yasser taibi June 3, 2022 06:27 AM UTC

Hello,

Please, I need help. I want to save in the database "idUser" to have each activity has a user who created.

I managed to create "idUser" in the database as you see.

==> Code "routes/activity"

sf.jpg

==> database

kh.JPG

Now I want to give the value of "id User", how i pass the value? knowing that I can recover the value and I don't know how to add it ?

==> Code "activity.component.ts"

hfhf.JPG




RV Ravikumar Venkatesan Syncfusion Team June 6, 2022 02:47 PM UTC

Hi Yasser,


We have validated your query “I want to save in the database ‘idUser’” at our end. We suggest you add the IdUser field value to the added or changed appointment data on the actionComplete event of the Schedule as shown in the below code snippet. So, you can get the IdUser field value that will be available at the server end and you can store it in your DataBase.


[app.component.ts]

export class AppComponent {

  public dataRecord<stringany>[] = extend([], zooEventsDatanulltrueas Record<stringany>[];

  public selectedDateDate = new Date(2021115);

  public eventSettingsEventSettingsModel = { dataSource: this.data };

  public currentViewView = 'Week';

 

  public onActionComplete(argsActionEventArgs): void {

    if (args.requestType === 'eventCreated') {

      // This block will execute once an appointment is created

      args.addedRecords[0].IdUser = 'User Id';

    }

    else if (args.requestType === 'eventChanged') {

      // This block will execute once an appointment is edited

      args.changedRecords[0].IdUser = 'User Id';

    }

  }

}


Sample: https://stackblitz.com/edit/ej2-angular-schedule-additing-custom-fields?file=app.component.ts


Kindly try the shared solution and let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



YT yasser taibi replied to Ravikumar Venkatesan June 9, 2022 11:27 AM UTC

I followed all the steps you suggested !!

==> Code "activity.component.ts"

11111.JPG


==> Code "activity.component.html"

444444.JPG


==> Code "routes/activity"

222222.JPG


==> database

333333.JPG

Did I do something wrong ?



RV Ravikumar Venkatesan Syncfusion Team June 10, 2022 11:44 AM UTC

Hi Yasser,


Sorry for the inconvenience caused.


We have validated your query “Did I do something wrong ?” at our end. We suggest you add the IdUser field value to the added or changed appointment data on the actionBegin event of the Schedule as shown in the below code snippet. So, you can get the IdUser field value that will be available at the server end and you can store it in your DataBase.


[app.component.ts]

export class AppComponent {

  public onActionBegin(argsActionEventArgs): void {

    console.log('args: 'args);

    if (args.requestType === 'eventCreate') {

      // This block will execute once an appointment is created

      args.addedRecords[0].IdUser = 1;

    }

    else if (args.requestType === 'eventChange') {

      // This block will execute once an appointment is edited

      args.changedRecords[0].IdUser = 1;

    }

  }

}


Sample: https://stackblitz.com/edit/ej2-angular-schedule-additing-custom-fields-6x7gzo?file=app.component.ts


Kindly try the shared solution and let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



YT yasser taibi replied to Ravikumar Venkatesan June 11, 2022 12:34 PM UTC

Thank you very much, now it works 



SK Satheesh Kumar Balasubramanian Syncfusion Team June 13, 2022 08:07 AM UTC

Hi Yasser,

Thanks for the update.

We are happy that your problem has been resolved now.

Regards,

Satheesh Kumar B



YT yasser taibi replied to Satheesh Kumar Balasubramanian June 13, 2022 11:46 AM UTC

I have another question, Now I want to show up the "activity" by user connected.

22.JPG


I edited in API, I gave him parameter "id_User".

==> Code "routes/activity"

11.JPG


But, I don't know how to add the parameter in here ??

==> Code "activity.component.ts"

33.JPG





RV Ravikumar Venkatesan Syncfusion Team June 14, 2022 04:44 PM UTC

Hi Yasser,


We have validated your query “I have another question, Now I want to show up the "activity" by user connected.” at our end. You can achieve your requirement by sending the user id as an additional parameter to the server using the addParams method of the Query. Refer to the below UG for more details.


UG: https://ej2.syncfusion.com/angular/documentation/schedule/data-binding/#passing-additional-parameters-to-the-server


Kindly let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



ME MEHDI EL AMINE June 17, 2022 02:36 AM UTC

Hey, i have a question please, i dont know how to use this Scheduler for that when the user connects to my app can only see, add or modify his activities.

And can i add like a userID attribute that links every activity added to the MONGODB database with its own user ??

If you could explain in the best way possible i would really appreciate it.

i am working with the MERN stack if that could help.



RV Ravikumar Venkatesan Syncfusion Team replied to Ravikumar Venkatesan June 17, 2022 01:44 PM UTC

Hi MEHDI,


Greetings from Syncfusion support.


Q1: I don't know how to use this Scheduler for that when the user connects to my app can only see, add or modify his activities.

You can send the userID to the server end using the addParams method. So, you can filter the userID specified activities alone from the server end and you can return them to the client end. So, the user can only see and edit the activities connected with his userID. Refer to the below update.


http://www.syncfusion.com/forums/148981/why-isnt-scheduler-populated-with-appointments-from-my-mongodb-server-using-mongoose?reply=SgnpJM


Q2: Can I add a userID attribute that links every activity added to the MongoDB database with its own user?

You can add the userID field to every activity added to the server using the actionBegin event of the Schedule as we suggested in the below update.


http://www.syncfusion.com/forums/148981/why-isnt-scheduler-populated-with-appointments-from-my-mongodb-server-using-mongoose?reply=SgnY2R


Kindly let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



YT yasser taibi June 19, 2022 11:09 AM UTC

I try to apply passing additional parameters to the server, but without result can you explain it more simply?

Please.


==> Code "routes/activity"

ds.JPG


==> Code "activity.component.ts"

21.JPG



RV Ravikumar Venkatesan Syncfusion Team June 22, 2022 03:35 PM UTC

Hi Yasser,


We have validated your query “I try to apply passing additional parameters to the server, but without result can you explain it more simply?” at our end.  When you send additional parameters to the server using the query property you will get it from “req.body” as shown in the below snips.


[In browser end]


[In server end]


Kindly let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



YT yasser taibi July 6, 2022 12:43 PM UTC

This time I am trying to display user activities by a drop-down list "<Select>/<Option>".

The problem is that I managed to display the first selected user but, if I want to change user, it does not give any result !! 

It doesn't take into consideration the parameters I gave it.


==>> First selection "user"


==>> Second selection "user"


==>>  Code "activity.component.ts"

jfj.JPG


==>>  Code "activity.component.html"

545.JPG



RV Ravikumar Venkatesan Syncfusion Team July 7, 2022 03:57 PM UTC

Hi Yasser,


We have validated your query “The problem is that I managed to display the first selected user but, if I want to change user, it does not give any result !!” at our end. We suggest you update the value of the updated user id on the previously added params of the Schedule query as shown in the below code snippet to fetch appointments based on the selected user id.


[app.component.ts]

  changeUser(args) {

    this.scheduleObj.eventSettings.query.params[0].value = '2';

    this.scheduleObj.refreshEvents();

  }


Before:



After:


Kindly try the shared solution and let us know if you need any further assistance.


Regards,

Ravikumar Venkatesan



YT yasser taibi August 8, 2022 10:22 AM UTC

Hi,

I try to add a (start date / end date) interval to the calendar, when I click on the add button.

code >> conge.component.ts  >> add button <<

02.JPG




RV Ravikumar Venkatesan Syncfusion Team August 9, 2022 12:22 PM UTC

Hi Yasser,


We have validated your query “I try to add a (start date / end date) interval to the calendar, when I click on the add button” based on your shared details at our end by preparing a sample at our end. In your shared appointment data the month of the appointment is mentioned as 07-July. So, we suspect that the appointment is rendered on the July month dates. So, we suggest you make sure the appointment is available or not on the respective July month dates as shown in the shared snip. We have prepared a sample for your reference.


Sample: https://stackblitz.com/edit/ej2-angular-schedule-add-event-method-sample?file=app.component.ts


Output:

Before add:


After add:


Regards,

Ravikumar Venkatesan

If this post is helpful, kindly consider accepting it as the solution so that other members can locate it more quickly.



YT yasser taibi August 30, 2022 09:42 AM UTC

Hello

this time i try to integrate the code you already gave me, but unfortunately i can't get the same result as you gave me, i share with you my code.


ts:

02.JPG


html:

03.JPG


Interface:



RV Ravikumar Venkatesan Syncfusion Team August 31, 2022 05:03 PM UTC

Hi Yasser,


We have validated your reported problem by modifying our previously shared sample based on your shared details. But, we are unable to reproduce the problem on our end. We suggest you bind the actionBegin, actionComplete, and actionFailure events to the Schedule and use the getEvents method of the Schedule as shown below to make sure the appointment is added to the Schedule dataSource list.


Sample: https://stackblitz.com/edit/ej2-angular-schedule-adding-event-through-public-method?file=app.component.ts


[app.component.html]

<div class="control-section">

  <button id="get-events-btn" (click)="getScheduleEvents($event)"> Get Schedule events list </button>

 

  <div class="schedule-container">

    <ejs-schedule #scheduleObj width='100%' height='650px' [eventSettings]="eventSettings" [(currentView)]="currentView"

      (actionBegin)="onActionBegin($event)" (actionComplete)="onActionComplete($event)"

      (actionFailure)="onActionFailure($event)">

    </ejs-schedule>

  </div>

</div>


[app.component.ts]

  private onActionBegin(args) {

    if (args.requestType === 'eventCreate') {

      console.log('action begin data'args);

    }

  }

 

  private onActionComplete(args) {

    if (args.requestType === 'eventCreated') {

      console.log('action complete data'args);

    }

  }

 

  private onActionFailure(args) {

    console.log('action failure data'args);

  }

 

  private getScheduleEvents() {

    console.log('Schedule events list:'this.scheduleObj.getEvents());

  }


Output:

Kindly let us know if you need any further assistance on this.


Regards,

Ravikumar Venkatesan


Loader.
Live Chat Icon For mobile
Up arrow icon