[REACT] eventStore and event internal id

[charlene]

Hi,

I am using eventStore to load the events in the Gantt.

Step 1 : After loading the eventStore, I am getting the eventStore records as such:

orgScheduleRef.current.instance.eventStore.records

Step 2 : Add new event to eventStore

orgScheduleRef.current.instance.eventStore.add({
            id: eventId,
            resource: ...,
            startDate: startDate.$d,
            endDate: endDate.$d
        })
        orgScheduleRef.current.instance.assignmentStore.add({
            resource: ...,
            event: eventId
        });

Step 3 : Before event edit, i am getting the eventRecord as such:

beforeEventEdit({ eventRecord }) {
                    console.log('eventRecord in beforeEventEdit :: ', eventRecord);

I noticed that the eventRecord.internalId is different in step 3 as compared to step 1 (for the events not added in step 2). However, for events added in step 2, the event.internalId is matching with the eventRecord.internalId in step 3. May i know is this the expected behaviour? Also, is it recommended to use internal id to compare the identical events?

Thanks.
Charlene

[ghulam.ghous]

Hi there,

I was not able to reproduce the mentioned behaviour. I have tried it in the console and the internalId is same for the records in step 1 and 3 which are not created at step 2. Because it cannot be different, as it is unique for each record created. So this is not the expected behaviour, can you share a small test case with us so we can see what is wrong? Also as I described above internalId will be unique for all the records created, so yes you can use it. But I have a question that why are you not using the simple id assigned to the events?

Regards,
Ghous

[charlene]

Hi,

I found out what is the issue. I can manage with id. I will like to update the event startDate /endDate. I have done as below, but it is not working. can you advise the correct way to do so, such that event is updated and reflects accordingly in Gantt ?

const eventRecord = eventStore.getById(event.id); //able to get the eventRecord
eventRecord.endDate = dayjs(currDate).$d; //endDate not updating

Thanks,
Charlene

[ghulam.ghous]

Hi Charlene,

I checked and it updates the event in the ui. See the clip here: https://drive.google.com/drive/folders/13Jil8qiVHJ19n0XrHMDIPtcI2NRU0zk6?usp=sharing

Perhaps you can try using the set method on eventModel https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/model/EventModel#function-set. But in any case the approach you are trying should works, can you share a test case with us?

Regards,
Ghous

[charlene]

hi,

Yes, sorry, i checked both method works. However, i noticed that when updating just startDate alone it updates the endDate too. I believe it is due to the duration is fixed. how do i only update the startDate alone (vice versa).

Thanks,
Charlene

[alex.l]

Hi,

Please see docs here https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/model/EventModel#function-setStartDate

keepDuration : Boolean true
Whether to keep the duration (and update the end date), while changing the start date, or vice-versa.

[charlene]

Hi,

i tried this method but i dont see the startDate updated. I also console.log the event after awaiting for promise to be fulfilled. I see that startDate value is not updated. any idea why?

let eventRecord = eventStore.getById(id);
const promise = eventRecord.setStartDate(dayjs(currDate).$d, false);
await Promise.resolve(promise);
console.log('eventRecord :: ', eventRecord); //startDate is not updated here. and in Gantt

Thanks,
Charlene

[alex.l]

Hi,

Maybe because new startDate is not valid and cannot be proceed?

We need steps to repro to know exaclty. I don't know what means this code dayjs(currDate).$d

Try to reproduce in our demo and share steps with us?