MVC Razor form button not calling controller specified

Question

So within my view, I have:

<div id="createProductModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Create Product</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                    @using (Html.BeginForm("Create", "Product", FormMethod.Post, new { id = "createProductForm", @class = "form-horizontal"}))
                    {
                        <div class="form-group">
                            <div class="col-md-4">
                                @Html.LabelFor(m => Model.Product.Name, new { @class = "control-label" })
                            </div>
                            <div class="col-sm-8">
                                @Html.TextBoxFor(m => Model.Product.Name, new { @class = "form-control" })
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-md-4">
                                @Html.LabelFor(m => Model.Product.IsActive, new { @class = "control-label" })
                            </div>
                            <div class="col-sm-8">
                                @Html.CheckBoxFor(m => Model.Product.IsActive, new { @class = "form-control" })
                            </div>
                        </div>
                    }
            </div>
            <div class="modal-footer">  
                <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="$('#createProductForm').submit();">Add product</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
            </div>
        </div>
    </div>
</div>

And then in my ProductsController I have added an action like so:

[HttpPost]
public ActionResult Create(Product product)
{
   return View();
}

But for some reason when clicking submit it redirects me to this URL:

http://localhost/Product/Create

And throws a 404 error like so:

The resource cannot be found.

I've not defined a route within the route configs surely this shouldn't matter?

Does anyone understand what i seem to be doing wrong?

Rui Jarimba · Answer 1 · 2018-08-21T23:28:22.140

2

Second parameter of Html.BeginForm is the controller name. Given that you have a ProductsController, instead of

Html.BeginForm("Create", "Product", ...

Try

Html.BeginForm("Create", "Products"

Check FormExtensions.BeginForm

edited Aug 21 '18 at 23:28

answered Aug 21 '18 at 23:24

Rui Jarimba

11,166
11
56
86

Wow, I can't believe I missed that. This raises another question, is my naming convention for the controller correct? I.e should it be called ProductController and not ProductsController? The page is to display a collection of product's hence the 's' – KTOV Aug 21 '18 at 23:27
@KTOV check https://stackoverflow.com/questions/12460060/asp-net-mvc-controller-naming-pluralization – Rui Jarimba Aug 21 '18 at 23:31

MVC Razor form button not calling controller specified

1 Answers1