Why axios not submitting data to ASP.NET Core Web API

Question

I am trying to send data from React app to my ASP.NET Core Web API with the help of Axios, but I'm not getting the data.

Axios code:

    axios.put(urlPath,
                {
                        method: 'put',
                        data: {
 PageDbId: "Soursbh",
            UserDbId:""
}
                    })
                .then(response => onSuccess(response))
                .catch(e => onError(e));

ASP.NET Core model class:

public class WebAvatarModel
{
    public string PageDbId { get; set; }
    public string UserDbId { get; set; }
}

ASP.NET Core code:

[HttpPut]
public IActionResult Save_Avatar([FromBody] WebAvatarModel model)
{
    var users = model;
    
    return null;
}

Always getting null in PageDbId and UserDbId.

I also tried this:

await axios.put(urlPath, JSON.stringify(body),
                {
                    method: 'put',
                    headers: {'Content-Type': 'application/json'}
                })
            .then(response => onSuccess(response))
            .catch(e => onError(e));

[HttpPut]
public async Task<IActionResult> Save_Avatar(WebAvatarModel model)
{
    var users = model;
    return null;
}

But it's still not working. What am I doing wrong?

Have you configured the routing right on the .net core ( I don't see the attribute for example HttpPut) — Dan Hunex
– Dan Hunex, Commented Jun 23, 2020 at 6:00
I only removed the put attribute for testing. it is there but still not working — Sourabh Devpura
– Sourabh Devpura, Commented Jun 23, 2020 at 6:16

Dai Nguyen · Accepted Answer · 2020-06-23 06:06:37Z

2

public IActionResult Save_Avatar([FromBody] WebAvatarModel model)

Did this api have [HttpPut]?

answered Jun 23, 2020 at 6:06

Dai Nguyen

796 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sourabh Devpura Over a year ago

Yes I am using put request for updating the data

Fei Han · Accepted Answer · 2020-06-23 06:40:37Z

1

Always getting null in PageDbId and UserDbId

If you check the actual request payload using browser developer tool, you would find that the data look like below.

You need to modify your code as below to provide correct request payload.

axios.put(urlPath,
    {
        PageDbId: "Soursbh",
        UserDbId: ""
    })
    .then(response => onSuccess(response))
    .catch(e => onError(e));

Or

axios({
    method: 'put',
    url: urlPath,
    data: {
        PageDbId: "Soursbh",
        UserDbId: ""
    }
})
    .then(response => onSuccess(response))
    .catch(e => onError(e));

Test Result

edited Jun 23, 2020 at 6:40

answered Jun 23, 2020 at 6:33

Fei Han

28k1 gold badge35 silver badges47 bronze badges

1 Comment

Sourabh Devpura Over a year ago

Thank you so much for your help. finally, it's working as I was expected :)

Collectives™ on Stack Overflow

Why axios not submitting data to ASP.NET Core Web API

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related