AJAX-код для реализации PUT в HTML-форме, похоже, не выполняется

Question

Мой веб-сайт использует API, который я написал.В настоящее время я написал страницу, которая использует GET, и страницу, которая использует POST.Однако у меня много проблем с PUT.

В настоящее время у меня есть две функции с одинаковым именем, но с разными аргументами.У меня есть ChangeOneEmu () и ChangeOneEmu (модель EmuItem), второй метод «положить».

Из предыдущего вопроса я узнал, что я не могу получить формы HTTP или даже тег для отправки вещей методом PUT, поскольку HTTP не поддерживает PUT.Поэтому я пытался использовать AJAX для отправки его через PUT, и он также, похоже, не работает.

По сути, сейчас происходит то, что моя функция с нет аргументов вызывает представление, которое корректно загружает представление - я могу нормально вводить данные.Однако когда я нажимаю кнопку «отправить», она не переходит к моему методу PUT (действие, которое выполняет аргумент модели).Он просто возвращается к действию без аргументов.

Вот код, который я реализовал в своем контроллере:

public IActionResult ChangeOneEmu()
{
    return View(new EmuItem());   
}

[HttpPut]
async public Task<IActionResult> ChangeOneEmuNew(EmuItem model)
{
    var response = await client.PutAsJsonAsync(model.SearchName, model);
    return RedirectToAction("Index");
}

А вот код, который я реализовал в своем представлении:

@model HelloEmuWebsite.Models.EmuItem

<script>
    $(document).ready(function () {
        $("SubmitMe").click(function () {
            $.ajax({
                url: '@Url.Action("ChangeOneEmuNew", "Home")',
                type: 'PUT',
                data: $('changeemuform').serialise(),
                //dataType: 'json',
                success: function (result) {
                    alert(result);
                }
            });
                return false;
        });
   }); 
</script>

<form method="put" id="SubmitMe">

    <div>
        @Html.LabelFor(x => x.SearchName)
        @Html.TextBoxFor(x => x.SearchName)
    </div>
    <div>
        @Html.LabelFor(x => x.Name)
        @Html.TextBoxFor(x => x.Name)
    </div>
    <div>
        @Html.LabelFor(x => x.Age)
        @Html.TextBoxFor(x => x.Age)
    </div>
    <div>
        @Html.LabelFor(x => x.Weight)
        @Html.TextBoxFor(x => x.Weight)
    </div>

    <input type="submit" value="OK" id="SubmitMe" ; />
    </form>

И на всякий случай вот моя настоящая реализация API:

[HttpPut("{id}")]
public ActionResult<List<Models.EmuItem>> Put(string id, [FromBody] Models.EmuItem ChangedEmu)
{
    if (ModelState.IsValid)
    {
        return MyEmus.ChangeEmu(id, ChangedEmu);

    }

    return BadRequest(ModelState);
}

Мне бы очень хотелось любая помощь.Я не уверен, в корне ли я неправильно понимаю, как работает шаблон ASP.NET CORE MVC, или как работают формы, или как работает AJAX, или все три или ни одного.Спасибо.

Answer 1

Внесите следующие изменения в ваше представление:

1. добавьте id="changeemuform " в <form>

   <form method="put"  id="changeemuform">
   

2. поместите ваш jQuery в@section Scripts {} и используйте правильный формат $("#id")

   @section Scripts
   {
    <script type="text/javascript">
        $(document).ready(function () {
           $("#SubmitMe").click(function () {
              $.ajax({
                  url: '@Url.Action("ChangeOneEmuNew", "Home")',
                  type: 'PUT',
                  data: $('#changeemuform').serialize(),
                 //dataType: 'json',
                  success: function (result) {
                     alert(result);
                  }
              });
               return false;
           });
        });
     </script>
   }