1

I'm creating a simple little website that interfaces with a web API, that allows users to have a database of emus. I am currently working on the PUT action in the controller. The put first goes from an action that just redirects to a new View. This View then prompts the user for information, and returns that in a model. A second action should then handle the information and call the API.

The first and second Action have the same name, so the second action that handles the API request has the [HttpPut] tag on top. However, if it has that tag, then the View never goes to the second Action-it just reloads the page when I press submit. However, if I put [HttpPost], it works just fine.

I have already tried changing the configuration in IIS Express, to no avail.

Here is the code for the View:

@model HelloEmuWebsite.Models.EmuItem
@using (Html.BeginForm())
{

    <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" />


}

And here is the code in the controller:

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

        [HttpPut]
        async public Task<IActionResult> ChangeOneEmu(EmuItem model)
        {
            var baseAddr = new Uri("my_url/api/values/");
            var client = new HttpClient { BaseAddress = baseAddr };
            var response = await client.PutAsJsonAsync(model.SearchName, model);
            return RedirectToAction("Index");
        }

And here is the code for the PUT request in my custom 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);
        }

Why does this happen? How can I fix it so that it will accept [HttpPut]? Alternatively, is there a better way to do this that does not rely on the [http] tags? Thanks!

Warbler
  • 71
  • 1
  • 2
  • 9
  • My guess JavaScript (or whatever code you have) you've used to send PUT request has issues... Can you please show it? (You've obviously searched how to enable PUT like https://stackoverflow.com/questions/12440277/how-do-i-enable-http-put-and-delete-for-asp-net-mvc-in-iis, so that should not be a problem)... You may want to doublecheck if PUT actually sent by your code - use Fiddler to confirm – Alexei Levenkov Jul 05 '19 at 20:19
  • @AlexeiLevenkov I have put in my code for the API. I know that the PUT works when I route the request through Postman. – Warbler Jul 05 '19 at 20:35
  • How are you sending your data to your `ChangeOneEmu`in your `Controller`? Can you show us that code? – Rahul Sharma Jul 05 '19 at 20:45
  • @RahulSharma I'm not sure I understand. What I've posted is all of the code I have for ChangeOneEmu. From my understanding of the process, the form should (in theory) be sending data back to ChangeOneEmu(model) upon submission. I may have an incorrect understanding of it however. – Warbler Jul 05 '19 at 20:50
  • @Warbler what do you use to send that PUT request? Since you [can't issue PUT from just HTML](https://stackoverflow.com/questions/8054165/using-put-method-in-html-form) you need some script doing so... Why don't you show that script - likely problem is there. – Alexei Levenkov Jul 05 '19 at 20:59

1 Answers1

1

Browsers only support GET and POST for sending forms. The only valid values for the method attribute are get and post, corresponding to the GET and POST HTTP methods. <form method="put"> is invalid HTML and will be treated like <form>, i.e. send a GET request. You can use AJAX to send your PUT request to your Controller:

You can assign a id to your form and button element and then send your model data like this:

$(document).ready(function () {
   $("#btnid").click(function () {
        $.ajax({
            url: '@Url.Action("ChangeOneEmu", "Home")',
            type: 'PUT',
            data: $('#formid').serialize(),
            dataType: 'json',
            success: function(result) {      
            }
        });
        return false;
    });
});
Rahul Sharma
  • 7,768
  • 2
  • 28
  • 54