MVC如何在提交时更改按钮文本

Question

我正在尝试创建一个带有几个按钮的简单 MVC 4 应用程序，当单击这些按钮时，它们的文本值会增加一个。问题是当我使用 按钮时，我无法在提交表单时更改文本值，而当我使用 时，没有任何内容传递给操作。

我有一个简单的 SQL 数据库，控制器会点击它，这是初始 ViewData 值的来源以及它如何存储按钮的当前值。

此外，我目前正在尝试使用多种表单来执行此操作，但如果可以使用一种表单，那将是理想的。

@using (Ajax.BeginForm("AddOne", "Home", null, new AjaxOptions { UpdateTargetId = "btn-tc-top"}, new { @class = "rectangle-top" }))
{   
     <input type="submit" class="button" name="button" id="btn-tc-top" value="@ViewData["ct-t"]"/>
}
@using (Ajax.BeginForm("AddOne", "Home", null, new AjaxOptions { UpdateTargetId = "btn-tc-bottom"}, new { @class = "rectangle-bottom" }))
{   
      <button type="submit" class="button" name="button" id="btn-tc-bottom">@ViewData["ct-b"]</button>
}

Answer 1

您可以订阅OnSuccess 处理程序：

@using (Ajax.BeginForm("AddOne", "Home", new { id = "btn-tc-top" }, new AjaxOptions { OnSuccess = "addSuccess" }, new { @class = "rectangle-top" }))
{   
    <input id="btn-tc-top" class="button" type="submit" name="button" value="@ViewData["ct-t"]" />
}
@using (Ajax.BeginForm("AddOne", "Home", new { id = "btn-tc-bottom" }, new AjaxOptions { OnSuccess = "addSuccess" }, new { @class = "rectangle-bottom" }))
{   
    <input id="btn-tc-bottom" class="button" type="submit" name="button" value="@ViewData["ct-b"]" />
}  

可以这样定义：

function addSuccess(result) {
    $('#' + result.id).val(result.text);
}

和控制器：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        ViewData["ct-t"] = "1";
        ViewData["ct-b"] = "2";
        return View();
    }

    [HttpPost]
    public ActionResult AddOne(string id, int button)
    {
        return Json(new { id = id, text = button + 1 });
    }
}