MVC提交按钮未触发

本文关键字:按钮 提交 MVC | 更新日期: 2023-09-27 18:10:19

我使用ASP.net MVC 4和Razor引擎。

我有一个页面(Index.cshtml)和一个控制器(HomeController.cs)

我正试图将我的提交按钮连接到我的控制器中的一个动作结果-但是我似乎不能让它着火。

我的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();
        }
    }

目前我还没有实现一个模型通过控制器传递值,我只是想看看我是否可以得到ActionResult SubmitForm的火。

我试过没有参数的@using (Html.BeginForm()),我也试过在我的ActionResult上面包括[HttpPost],没有任何运气。

编辑我也试过用<input type="submit" id="btnSave">Save</input>代替按钮。

不知道哪里出了问题

MVC提交按钮未触发

原来是jQuery在阻止ActionResult被点击

我有一个按钮点击事件,它"吞噬"了ActionResult功能。我通过使用Ajax调用ActionResult来解决这个问题。

不需要使用"-Controller"后缀。使用Home而不是HomeController, MVC会为你转换它。

使用

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

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

完整代码<<p> 视图/strong>

@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>
}
控制器

[HttpPost]
public ActionResult SubmitForm()
{
    return 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>
}

控制器:

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

可能是由于div内的其他HTML而发生的问题,所以请检查一下。

你需要添加Html。使用参数BeginForm。下面是一个例子:

ActionName -动作的名称。在本例中,名称为Create。

ControllerName -控制器名称。在本例中,名称为Home。

FormMethod -它指定了表单方法,即GET或POST。在本例中,它将被设置为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);
        }

TL;DR

我有[Required]数据属性在我的视图模型防止提交工作时,表单没有填写。


我在MVC代码中有两个提交按钮,一个用于Submit,另一个用于Cancel

当数据输入时,两个按钮都正确触发,但当没有输入任何内容时,这两个按钮都不正确。

我花了一点时间才意识到我的视图模型有[Required]字段验证!

视图:

@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]
    ...
}
控制器方法:

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

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

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

说明:不需要在任何地方添加Controller后缀,默认接受

控制器

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

解释:由于您给出的表单方法是Post,因此需要在Action之前包含[HttpPost],并且您传递的参数在Action方法

中缺失