Need to send additional information as part of body of query to the server-side

[Madhukar]

Hi,

   I have implemented the React (EJ2) version of the schedule component. I am using the WebApiAdaptor and the datamanager to tie it my server backend which is processing the scheduling requests from the frontend.

    Now for my server to know who is sending the event add (or update or delete) request, i need to send a user Id in the body of the request (alongwith the EventId, starttime, endtime, startdate, enddate, description etc. of the event information itself. I cant use the Query option since it only works with GET functions and is not appearing in the POST or PUT functions.

     I dont want to introduce an additional field in the event editor template (since the ID is something that is not an user input in the event itself). What are the other options available to send additional data to server alongwith the event data (going via the data manager + adaptor)

  this is what the relevant sections of my code look like.. Below the datamanager part

 const dataManager = new DataManager({

    url: `https://vcxxxxx.execute-xx.-west-2.amazonaws.com/dev/calendar/`,

    adaptor: new CustomAdaptor(userDetails),

    crossDomain: true,

  });

 const addedQuery = new Query().addParams('userId', userDetails._id);

  and the part where i am invoking the scheduler component itself

 <ScheduleComponent

            height="650px"

            ref={schedule => (localProps.scheduleObj = schedule)}

            selectedDate={new Date()}

            dragStart={onDragStart}

            eventSettings={{ dataSource: dataManager, query: addedQuery }}

            dataBinding={onDataBinding}

            popupOpen={onPopupOpen}

           

          >

            {ViewDirectiveOptions(viewOption)}

            <Inject services={InjectServicesOptions(viewOption)} />

          </ScheduleComponent>

    any pointers would help.

thanks much

Madhukar

[Balasubramanian Sattanathan]

Hi Madhukar, 

Greetings from Syncfusion Support. 

We have analyzed your requirement and prepared a sample based on that by using the below code snippet. And we let you know that the parameter name should be the same for both the server and client-side. 

Client-side: 

this.userId = 10; 

this.dataManger = new DataManager({ 

  url: 'http://localhost:54738/Home/LoadData', // Here need to mention the web api sample running path 

  crudUrl: 'http://localhost:54738/Home/UpdateData', 

  crossDomain: true, 

  adaptor: new UrlAdaptor 

}); 

this.dataQuery = new Query().from("Events").addParams('userId', this.userId) 

Server-side: 

public class Params 

{ 

    public DateTime StartDate { get; set; } 

    public DateTime EndDate { get; set; } 

    public int userId { get; set; } 

} 

Sample: https://stackblitz.com/edit/react-6gekgr-abqmrf?file=index.js 

Service: https://www.syncfusion.com/downloads/support/forum/159164/ze/ScheduleCRUD_with_addParams-1307256227.zip 

UG: https://ej2.syncfusion.com/react/documentation/schedule/data-binding/#scheduler-crud-actions 

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

Regards, 

Balasubramanian S

[Madhukar]

Hi Bala,

   Thanks for your prompt response. Much appreciated. However, I have exactly the same thing on the serverside and I am able to see the userId come in for the fetch requests (the GET requests). But for the POST, PUT and DELETE (for the other CRUD actions like Update, Delete etc) the query doesnt seem to work as I dont see the userId anywhere in the body of the query coming into the backend (I get something like this in the URL 

https://vcxxxxx.execute-xx.-west-2.amazonaws.com/dev/calendar/batch$

(i.e. no params attached with the POST request)

and then in the body I dont see the key-value pair of {userID: value}  at all anywhere.

thanks

Madhukar

[Madhukar]

Any updates? Do let me know if you need any more info. 

thanks!

[Balasubramanian Sattanathan]

Hi Madhukar, 

Thanks for the update. 

We have analyzed your reported scenario and let you know that the CRUD operations are working properly in the shared project and the additional parameters also fetched properly on the server-side. 

Here is the video demo that works as expected. 

https://www.syncfusion.com/downloads/support/forum/159164/ze/video_demo-1634422499.zip 

Kindly refer to the above video and let us know the below details if the problem is not resolved. 

• Share server-side code snippet for CRUD operations
• Replicate your problem in the above sample
• Share a sample(if possible) illustrating the problem which would help us to proceed further

Regards, 

Balasubramanian S