DataManager REST request always returns error 405 (CORS enabled)

[Alberto Vázquez]

Hello,

I'm implementing your Grid component with CRUD functionnality in my Angular frontend.

After reading and following your documentation: https://ej2.syncfusion.com/16.1.32/angular/documentation/grid/edit.html#persisting-data-in-server and https://ej2.syncfusion.com/16.1.32/angular/documentation/data/adaptors.html I'm trying to implement your DataManager with an URL adaptor, so it can perform the CRUD operations as well as getting the data from my backend that it's a “remote” REST server (written by me in C#) once the component has been initialized.

I'm not sure if my problem lies in my back or front-end or maybe it's both, but everytime that the DataManager sends a request it gets the error: Response for preflight has invalid HTTP status code 405

I don't think CORS is the issue since on my server side controller I have all enabled:

[EnableCors(origins: "*", headers: "*", methods: "*")]

Also, if I try to consume the service directly from Angular with a method made by me using the same address, I get the expected result without errors.

This is the DataManager that I'm creating:

this.dataManager = new DataManager({

url: http://locahost:50284/api/Usr_DM, //GET address

updateUrl: http://locahost:50284/api/Permits, //PUT address

insertUrl: null, //POST & DELETE won't be implemented

removeUrl: null, //I've tried filling insert & remove URL with mock addresses but that didn't work either

adaptor: new UrlAdaptor

});

Am I doing something wrong in the instanciation of the DataManager? Should I do something in on the back end to allow DataManager through, like importing a method from a namespace? How could I debug this?

If you're not sure how to help me, could you show me a simple but working example of what my back end REST controller should look like?

Appreciate your help and thank you in advance.

[Isuriya Rajan]

Hi Alberto, 

Thanks for contacting Syncfusion support, 

We have validated your query and we suspect that the Web API is not configured to respond to the preflight request.  

To resolve this, we suggest you to try the any of this below solutions. 

     

1. Add this below options in your Application_BeginRequest of the Global.cs file.

               

protected void Application_BeginRequest(object sender, EventArgs e) 

        { 

            if (HttpContext.Current.Request.HttpMethod == "OPTIONS") 

            { 

                HttpContext.Current.Response.Headers.Add("Access-Control-Allow-Headers", "Content-Type"); 

              HttpContext.Current.Response.Headers.Add("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, HEAD, PATCH, OPTIONS"); 

                HttpContext.Current.Response.End(); 

            } 

        } 

2. Also refer to the below blog link in which CORS option is enabled through WebApiConfig.cs

https://advancecodingsolution.com/2017/11/07/angularjs-with-asp-net-web-api-http-post-returning-xmlhttprequest-cannot-load-response-for-preflight-has-invalid-http-status-code-405/ 

 

Please get back to us if you need any other assistance. 

Regards, 

Isuriya R 

[Amanuel]

I encountered the same 405 error in asp net core grid datamanager. In my case I forgot to add 

[FromBody] DataManagerRequest dm to the function a parameter in my controller action

public async Task<IActionResult> GetPatients([FromBody] DataManagerRequest dm)

{

    ...

}

[Rajapandi Ravi]

Hi Amanuel,

Thanks for your update

Before we start providing a solution to your query, we need more information for our clarification. Please share the below details that will be helpful for us to provide a better solution.

1)          Share your exact requirement with a detailed description.

2)          Please share your complete Grid rendering code(Client and Server-side).

3)          Explain your requirement scenario with pictorial representation or video demonstration.

Regards,

Rajapandi R

[Harshita Ojha]

I am getting 405 error when trying to call my api.

Angular code:

 new DataManager({ url: url, adaptor: new UrlAdaptor, crossDomain: true })

          .executeQuery(new Query())

          .then((e: any) => {

            debugger;

            state.dataSource(e.result);

         

});

API Code

 [HttpGet]

        [Route("GetAllTransactionData")]

        public async Task<IActionResult> GetAllTransactionData(int clientId)

        {

            try

            {

                string userName = this.User.GetEmail();

                return Ok(await _transactionService.GetAllTransactionData(clientId));

            }

            catch (Exception ex)

            {

                string correlationId = await _exceptionLogHelper.LogException(ex, "TransactionData", "GetAllTransactionData");

                return BadRequest(ex.Message);

            }

        }

The error i am getting is :

Please note: When trying to call the API without the datamanager its working fine the api is returning the value

[Joseph Christ Nithin Issack]

Hi Harshita,

  Thanks for your update.

  On inspecting the code example we could see that you are using url adaptor for binding the data to the grid. By default when using the UrlAdaptor, you need to return the data as JSON from the controller action and the JSON object must contain a property as result with dataSource as its value and one more property count with the dataSource total records count as its value. But in your case we are not aware of the response you are returning from the server. So we would like you to share the following information so that we will be able to proceed further.

• Please share the details of how you are handling the server side actions mainly in the method ` _transactionService.GetAllTransactionData`.
• Please share a simple sample to reproduce the issue you are facing.
• Please share a video demo of the issue you are facing.

Please get back to us for further details.

Regards,

Joseph I.