MVC submit button not firing

Question

I am using ASP.net MVC 4 with the Razor engine.

I have a page (Index.cshtml) and a controller (HomeController.cs)

I am trying to hook up my submit button to an Action Result in my controller - however i can't seem to get it to fire.

My HTML :

@using (Html.BeginForm("SubmitForm", "Home", FormMethod.Post))
{
      <div class="main-Background">

      ******lots of other html here*******
        <button type="submit" id="btnSave">Save</button>

    </div>
}

My Controller :

public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application.";

            return View();
        }

        public ActionResult About()
        {
            ViewBag.Message = "Your app description page.";

            return View();
        }

        public ActionResult Contact()
        {
            ViewBag.Message = "Your contact page.";

            return View();
        }


        [HttpPost]
        public ActionResult SubmitForm()
        {
          return View();
        }

    }

At the moment i havn't implemented a model to pass the values through to the controller, i just wanted to see if i could get the ActionResult SubmitForm to fire.

I have tried @using (Html.BeginForm()) with no parameters, i have also tried including [HttpPost] above my ActionResult, without any luck.

Edit i have also tried using <input type="submit" id="btnSave">Save</input> instead of a button.

Not sure where i am going wrong

Answer 1

It turns out that jQuery was stopping the ActionResult from being hit.

I had a button click event which was "eating up" the ActionResult functionality. I solved this by calling my ActionResult using Ajax.

Answer 2

You dont need to use "-Controller" suffix. Use just Home instead of HomeController, MVC will convert it for you.

Use

@using (Html.BeginForm("SubmitForm", "Home", FormMethod.Post, new { id = "submitForm" }))

instead of

@using (Html.BeginForm("SubmitForm", "HomeController", FormMethod.Post, new { id = "submitForm" }))

---

Full codes

view

@using (Html.BeginForm("SubmitForm", "Home", FormMethod.Post, new { id = "submitForm" }))
{
      <div class="main-Background">

          ******lots of other html here*******
          <input type="submit" id="btnSave">Save</input>

    </div>
}

And controller

[HttpPost]
public ActionResult SubmitForm()
{
    return View();
}

Answer 3

View:

@using (Html.BeginForm("SubmitForm", "Home", FormMethod.Post))
{
  <div class="main-Background">
    ******lots of other html here*******
    <button type="submit" id="btnSave">Save</button>

  </div>
}

Controller:

[HttpPost]
public ActionResult SubmitForm()
{
    return View();
}

May be the problem is occurred because of other HTML inside your div so check it out. Otherwise it works perfectly.

Answer 4

You need to add Html.BeginForm with the parameters. Here is an example:

ActionName – Name of the Action. In this case the name is Create.

ControllerName – Name of the Controller. In this case the name is Home.

FormMethod – It specifies the Form Method i.e. GET or POST. In this case it will be set to POST.

http://localhost:60386//Home/Create


@using (Html.BeginForm("Create", "Home", FormMethod.Post))
{
  @Html.EditorFor(model => model.FirstName)

  <input type="submit" value="Create"/>
}


HomeController.cs:
        [HttpPost]
        public ActionResult Create(Person person)
        {

            if (ModelState.IsValid)
            {
                db.Persons.Add(person);
                db.SaveChanges();
                return RedirectToAction("Create");
            }

            return View(person);
        }

Answer 5

TL;DR

I had [Required] data attributes on my view model preventing the submit from working when the form wasn't filled.

---

I had two submit buttons in my MVC code, one for Submit, the other for Cancel.

Both buttons were firing correctly on data entry, but neither when nothing was entered.

It took me a bit to realize that my view model had [Required] field validations in place!

View:

@using (Html.BeginForm(actionName: "Index", controllerName: "User", method: FormMethod.Post))
{
    @Html.AntiForgeryToken()
    
    @Html.TextBoxFor(m => m.PhoneNumber)
    
    ...
    
    <input type="submit" name="submitAction" value="Verify" />
    <input type="submit" name="submitAction" value="Cancel" />
}

ViewModel:

public class UserViewModel
{
    [Required]
    [MaxLength(10)]
    public string PhoneNumber { get; set; }
    
    [Required]
    ...
}

Controller Method:

[HttpPost]
[ValidateAntiForgeryToken()]
public ActionResult Index(UserViewModel viewModel, string submitAction)
{
    switch(submitAction)
    {
        case "Verify": ...
        
        case "Cancel": ...
    }

}

Answer 6

Change this @using (Html.BeginForm("SubmitForm", "HomeController", FormMethod.Post, new { id = "submitForm" }))

to

@using (Html.BeginForm("SubmitForm", "Home", FormMethod.Post, new { id = "submitForm" }))

Explanation : No need to suffix Controller anywhere, it being accepted by default

and in the Controller

[HttpPost]
public ActionResult SubmitForm(string id)
    {

        return View();
    }

Explanation : as the Form Method given by you is Post so need to include [HttpPost] before the Action and the parameter you were passing was missing in the action method