Our pure JavaScript Scheduler component


Post by saki »

You can use any variable that is accessible in both methods. E.g.:


let childId, parentId;
const crudManager = {
    listeners : {
        load({ response }) {
            console.log(response);
            const
                start = new Date(response.calendar.startDate);
            const end = new Date(response.calendar.endDate);
            childId = (response.details.childId);
            parentId = response.details.parentId;
    
            this.scheduler.setTimeSpan(start, end);      // set calendar startdate and enddate
        },
        beforeResponseApply : ({ response }) => {
            response.resources.rows = response.resources.values;
            response.events.rows = response.events.values;
            response.timeRanges.rows = response.timeRanges.dueDates;
        },
        beforeSend : ({ params }) => {
            params.childId = childId;
        }
    },
    autoLoad  : true,
    autoSync  : true,
    transport : {
        load : {
            url    : 'https://localhost:5000/api/Schedule',
            params : {
                outputScheduleId : JSON.parse(
                    localStorage.getItem('CurrentSelectedSchedule')
                )
  
            },
   
            method      : 'GET',
            credentials : 'omit'
        },
        sync : {
            url : 'https://localhost:5000/api/ReScheduling',
    
            headers : {
                'Content-Type' : 'application/json'
            },
            method      : 'POST',
            credentials : 'omit'
  
        }
  
    }
};

Post by Aniket »

Saki, I am trying this approach see attached code,but as soon as the schedule loads on the screen, saving changes of the sync starts to run

 this.crudManager = {
      listeners: {
        load({ response }) {
          console.log(response);
          const
            start = new Date(response.calendar.startDate);
          const end = new Date(response.calendar.endDate);
         localStorage.setItem('CurrentSelectedScheduleChildId', response.details.childId);
        this.scheduler.setTimeSpan(start, end);      // set calendar startdate and enddate
        },
        beforeResponseApply: ({ response }) => {
          response.resources.rows = response.resources.vehicles;
          response.events.rows = response.events.tests;
          response.timeRanges.rows = response.timeRanges.dueDates;
         
}, }, autoLoad: true, autoSync: true, transport: { load: { url: 'https://localhost:5000/api/Schedule', params: { outputScheduleId: JSON.parse( localStorage.getItem('CurrentSelectedSchedule') ), }, // url: './assets/data/gantt/data2.json', method: 'GET', credentials: 'omit', }, sync: { url: 'https://localhost:5000/api/ReScheduling', params: { outputSchedulechildId: JSON.parse( localStorage.getItem('CurrentSelectedScheduleChildId') ) }, headers: { 'Content-Type': 'application/json' }, method: 'POST', credentials: 'omit', } } };

It seems both load and sync start running simulataneously.


Post by Maxim Gorkovsky »

Auto sync is triggered when there are changes in the dataset. Applying load response should not trigger sync request. Try to pause in the debugger and instpect call stack to see what caused sync call.
Or you can provide a runnable test case for us to inspect.


Post by Aniket »

Maxim, In my above code, the load request is getting called twice, and sync gets fired as well.

Is anything incorrect in my above code u can see?


Post by Maxim Gorkovsky »

I don't see anything incorrect in your code snippets, it is other code which triggers load. Could you provide runnable test case?


Post by Aniket »

maxim, how could i provide a runnable test case?

I have the library integrated in my main code of application.

Any idea how can I send this?


Post by Maxim Gorkovsky »

Usually we recommend to modify one of our demos, porting custom code piece by piece until issue becomes reproducible. Then you can remove node_modules, zip the app and upload it here.


Post by Aniket »

ok maxim, just to inform I have declared and initialised the scheduler properties in a method and call it in the ngonInit.

Inside this method only I have configred the crudManager, is it the reason it is being called twice?


Post by Maxim Gorkovsky »

In case ngonInit is called twice, crud manager could be created and loaded twice, that really depends on your app architecture.
I'd recommend to check how we create crud manager in our angular demos, like this one: https://www.bryntum.com/examples/scheduler/angular/custom-event-editor/dist/custom-event-editor/index.html


Post by Aniket »

Maxim, unfortunately the ngOnit also gets called only once, but still sync gets fired automatically as load completes.
as saving changes spinner pops and sync url gets hit at the backend


Post Reply