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?
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
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
mongoDB
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?
Refer to the below UG for more details about working with Schedule Timezone.
https://ej2.syncfusion.com/angular/documentation/schedule/timezone/
Regards,
Ravikumar Venkatesan
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"
==> database
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"
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 data: Record<string, any>[] = extend([], zooEventsData, null, true) as Record<string, any>[]; public selectedDate: Date = new Date(2021, 1, 15); public eventSettings: EventSettingsModel = { dataSource: this.data }; public currentView: View = 'Week';
public onActionComplete(args: ActionEventArgs): 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
I followed all the steps you suggested !!
==> Code "activity.component.ts"
==> Code "activity.component.html"
==> Code "routes/activity"
==> database
Did I do something wrong ?
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(args: ActionEventArgs): 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
Thank you very much, now it works
Hi Yasser,
Thanks for the update.
We are happy that your problem has been resolved now.
Regards,
Satheesh Kumar B
I have another question, Now I want to show up the "activity" by user connected.
I edited in API, I gave him parameter "id_User".
==> Code "routes/activity"
But, I don't know how to add the parameter in here ??
==> Code "activity.component.ts"
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.
Kindly let us know if you need any further assistance.
Regards,
Ravikumar Venkatesan
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.
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.
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.
Kindly let us know if you need any further assistance.
Regards,
Ravikumar Venkatesan
I try to apply passing additional parameters to the server, but without result can you explain it more simply?
Please.
==> Code "routes/activity"
==> Code "activity.component.ts"
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
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"
==>> Code "activity.component.html"
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
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 <<
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.
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:
html:
Interface:
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.
[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