Async Method returns 404

Question

I got the following problem.

in my Controller, this method is supposed to return a JSON with the pets from the database. but is being called, the server returns a 404.

public async Task<JsonResult> GetPetsAsync(int ownerId )
        {
            var pets = await _dataContext.Pets
                .Where(p => p.Owner.Id == ownerId)
                .OrderBy(p => p.Name)
                .ToListAsync();
            return Json(pets);
        }

=====================================================

This is the form that provides the OwnerId for the method to find the pets for that particular owner.

<div class="row m-auto align-content-center">
    <div class="col-md-4">
        <form asp-action="Assign" enctype="multipart/form-data">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <input type="hidden" asp-for="Id" />

            <div class="form-group">
                <label asp-for="OwnerId" class="form-label fw-bold"></label>
                <select asp-for="OwnerId" asp-items="Model.Owners" class="form-control"></select>
                <span asp-validation-for="OwnerId" class="text-danger"></span>
            </div>

            <div class="form-group">
                <label asp-for="PetId" class="form-label fw-bold"></label>
                <select asp-for="PetId" asp-items="Model.Pets" class="form-control"></select>
                <span asp-validation-for="PetId" class="text-danger"></span>
            </div>

            <div class="form-group">
                <label asp-for="Remarks" class="form-label fw-bold "></label>
                <textarea asp-for="Remarks" class="form-control"></textarea>
                <span asp-validation-for="Remarks" class="text-danger"></span>
            </div>

            <div class="form-group mt-3">
                <button value="Assign" type="submit" class="btn btn-primary btn-sm"><i class="bi bi-calendar-plus-fill"></i></button>
                <a asp-action="Index" class="btn btn-success btn-sm"><i class="bi bi-arrow-return-left"></i> Go Back</a>
                <span asp-validation-for="Remarks" class="text-danger"></span>
            </div>


        </form>
    </div>
</div>

In my View -- the AJAX request to GetPetsAsync

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    <script type="text/javascript">
        $(document).ready(function () {
            $("#OwnerId").change(function () {
                $("#PetId").empty();
                $.ajax({
                    type: 'POST',
                    url: '@Url.Action("GetPetsAsync", "Agenda")',
                    //Take the OwnerId and send it to the JsonResult Method to retrieve the pets
                    data: { ownerId: $("#OwnerId").val() },
                    dataType: 'Json',
                    success: function (pets) {
                        $("#PetId").append('<option value="0">(Select a pet...)</option>');
                        $.each(pets, function (i, pet) {
                            $("#PetId").append('<option value="'
                                + pet.id + '">'
                                + pet.name + '</option>');
                        });
                    },
                    error: function (ex) {
                        alert('Failed to retrieve pets. ' + ex.statusText);
                    }
                });
                return false;
            })
        });
    </script>

Answer 1

It looks like this feature change is affecting you.

Async suffix for controller action names will be trimmed by default #14716

You can just drop the "Async" suffix from your view-side code. Which is why renaming your method "fixed" your problem.

You have control over this behavior in your app startup with SuppressAsyncSuffixInActionName

builder.Services.AddMvc(options =>
{
    options.SuppressAsyncSuffixInActionNames = false;
});

Answer 2

Make sure the "httppost" attribute is used. If you continue to get an error, check the data part in the ajax section.

Answer 3

I found the solution. Incredibly just by changing the Method Name to GetPetAsyncronous the problem was solve. I don’t know why the previous method wouldn’t work. But It worked.

Answer 4

As @IvancitoOficial answered, changing the Method Name to GetPetAsyncronous resolved the probled problem was solve.