C# 将按钮事件等转换为ASP.NET MVC

C# 将按钮事件等转换为ASP.NET MVC,c#,asp.net-mvc,C#,Asp.net Mvc,给定一个asp.net Web表单页面 asp.net <asp:textbox id="txtA" runat="server" /> <asp:textbox id="txtB" runat="server" /> <asp:button id="btnAddTogether" runat="server" text="Go" onclick="btn_Click"/> <asp:textbox id="txtResult" runat="

给定一个asp.net Web表单页面

asp.net

 <asp:textbox id="txtA" runat="server" />
 <asp:textbox id="txtB" runat="server" />
 <asp:button id="btnAddTogether" runat="server" text="Go" onclick="btn_Click"/>

 <asp:textbox id="txtResult" runat="server" />

如何将其转换为ASP.NET MVC。这是一个非常简单的例子,但我不确定如何改变我的思维方式。

实际上没有直接转换

理论上,该按钮将向控制器提交模型(通过
标记)以进行更新操作。然后,字符串操作将发生在控制器代码内部

    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

    [ActionName("Different")]
    [SubmitCommand("DoSave")]
    public ActionResult DifferentSave()
    {
      TempData["message"] = "saved! - defferent";
      return View("Index");
    }

    [ActionName("Different")]
    [SubmitCommand("DoDelete")]
    public ActionResult DifferentDelete()
    {
      TempData["message"] = "deleted! - defferent";
      return View("Index");
    }

    [ActionName("Same")]
    [SubmitCommand("DoSubmit","Save")]
    public ActionResult SameSave()
    {
      TempData["message"] = "saved! - same";
      return View("Index");
    }

    [ActionName("Same")]
    [SubmitCommand("DoSubmit","Delete")]
    public ActionResult SameDelete()
    {
      TempData["message"] = "deleted! - same";
      return View("Index");
    }
  }
你的例子会变成这样:

<% using Html.BeginForm("Update", "Home") { %>
    <%= Html.TextBox("txtA") %>
    <%= Html.TextBox("txtB") %>
    <input type="submit" value="Submit" />
<% } %

您可以创建一个提交到操作的
标记,而不是
单击处理程序。

然后,该操作可以执行其逻辑并返回显示结果的视图。

如果您在此处查看MVC教程,效果会更好


如果您真的想将当前的应用程序更改为MVC,那么您应该先看视频

我还建议您阅读MVC教程,但对于这种特殊情况,您可以执行以下操作

在.aspx中(假设它被称为ViewA):


请注意,这不是推荐的方法,与其使用ViewData字典,不如使用一个特定的ViewModel类来处理特定视图的所有数据。

也有这样的方法

  [AttributeUsage(AttributeTargets.Method, 
                  AllowMultiple = false, Inherited = true)]
  public class SubmitCommandAttribute : ActionMethodSelectorAttribute
  {
    private string _submitName;
    private string _submitValue;
    private static readonly AcceptVerbsAttribute _innerAttribute = 
                                 new AcceptVerbsAttribute(HttpVerbs.Post);

    public SubmitCommandAttribute(string name) : this(name, string.Empty) { }
        public SubmitCommandAttribute(string name, string value)
    {
          _submitName = name;
          _submitValue = value;
    }

    public override bool IsValidForRequest(ControllerContext controllerContext, 
                                           MethodInfo methodInfo)
    {
      if (!_innerAttribute.IsValidForRequest(controllerContext, methodInfo))
        return false;

      // Form Value
      var submitted = controllerContext.RequestContext
                                       .HttpContext
                                       .Request.Form[_submitName];
      return string.IsNullOrEmpty(_submitValue)
               ? !string.IsNullOrEmpty(submitted)
               : string.Equals(submitted, _submitValue, 
                               StringComparison.InvariantCultureIgnoreCase);
    }
  }
示例控制器代码

    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

    [ActionName("Different")]
    [SubmitCommand("DoSave")]
    public ActionResult DifferentSave()
    {
      TempData["message"] = "saved! - defferent";
      return View("Index");
    }

    [ActionName("Different")]
    [SubmitCommand("DoDelete")]
    public ActionResult DifferentDelete()
    {
      TempData["message"] = "deleted! - defferent";
      return View("Index");
    }

    [ActionName("Same")]
    [SubmitCommand("DoSubmit","Save")]
    public ActionResult SameSave()
    {
      TempData["message"] = "saved! - same";
      return View("Index");
    }

    [ActionName("Same")]
    [SubmitCommand("DoSubmit","Delete")]
    public ActionResult SameDelete()
    {
      TempData["message"] = "deleted! - same";
      return View("Index");
    }
  }
和视图

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Index</title>
</head>
<body>
  <h1><%= TempData["message"] ?? "Click some button" %></h1>

  <h2>Different sumit name(ignore value).</h2>    
  <% using (Html.BeginForm("Different", "Home")) { %>
    <input type="submit" name="DoSave" value="Save" /><br />
    <input type="submit" name="DoDelete" value="Delete" />
    <% } %>

  <h2>same submit name and different value.</h2>    
  <% using (Html.BeginForm("Same","Home")) { %>
    <input type="submit" name="DoSubmit" value="Save" /><br />
    <input type="submit" name="DoSubmit" value="Delete" />
    <% } %>
</body>
</html>

指数
不同的sumit名称(忽略值)。

相同的提交名称和不同的值。

希望这段代码有用。

您不必像其他人建议的那样创建任何视图。您不必将其包装成表单,因为这些输入可能是更大表单的一部分。

当您开始使用ASP.NETMVC时,您必须学习JavaScript/jQuery。它可以替代WebForms中使用回发机制解决的许多函数

此示例可以在客户端或服务器端轻松解决:

<form action="" method="post">
<%= Html.TextBox("txtA") %>
<%= Html.TextBox("txtB") %>
<button id="btClientSideAdd" onclick="$('#txtResult').val($('#txtA').val() + $('#txtB').val()); return false;">
    Add on client</button>
<button id="btServerSideAdd" onclick="$.post('Home/Add', { a: $('#txtA').val(), b: $('#txtB').val()  }, function(data) { $('#txtResult').val(data) }); return false;">
    Add on server</button>
<%= Html.TextBox("txtResult") %>
<input type="submit" />
</form>
public JsonResult Add(string txtA, string txtB)
{
    return Json(txtA + txtB);
}
此代码在客户端添加:

$('#txtResult').val($('#txtA').val() + $('#txtB').val());
您还可以将值传递给服务器:

$.post(
  'Home/Add', //Action to execute
  { a: $('#txtA').val(), b: $('#txtB').val()  }, //input values
  function(data) { $('#txtResult').val(data) } //what to do with result
);

要在客户端执行此操作,必须使用。了解如何使用局部视图和JsonResults

你能给我举个例子让我开始学习吗?谢谢贾斯汀。正如@Anero所提到的,这是一种令人讨厌的方式,但它会起作用。我现在已经转换成ViewData方式:)@Sophie88:使用ViewData是一种糟糕的方法。您应该远离非强类型的解决方案。使用视图模型是最好的方法。@Sophie88 LukLed是对的,您应该尝试使用ViewModel(它是强类型的,与ViewData collection不同)。+1对于附录,MVC和ASP.NET“经典”之间有一个基本的思想转变,它可以追溯到基本的管道和概念。是的,你可以用“旧”的方式做事,但它真的很快就变黑了。@Anero-谢谢。这是一个很好的解决方案,但我将采用最佳实践:)尽管jQuery包含在MVC中,但不需要使用它。虽然它适用于这个小例子,但对于长期或更复杂的业务逻辑来说,它可能不是一个好建议。@GalacticCowboy:对不起,但我不同意。当您想要更新部分页面时,jQuery/AJAX是基本工具。是否要发布整个页面以更新一个字段?这太疯狂了。没有使用jQuery的要求,但不使用jQuery是不明智的。正如我所说,“虽然它适用于这个微不足道的示例…”-我想你已经准确地说明了我想要说的。OP是一个相当简单的示例,因此在该场景中jQuery是非常有意义的。作为如何处理表单提交等的一个更大的例子,没有那么多。@GalacticCowboy:但它不是表单提交。如果是表单提交,则会有其他回发代码。绝对没有提交代码(没有进一步的处理、验证、保存到数据库等)。她想填写表单的一些部分并继续工作。她询问的是“MVC方式”——MVC与ASP.NET之间的思想转变。如OP中所述,这是一个简单、精心设计的示例,演示了在ASP.NET中提交表单、在服务器端执行某些操作并向客户端返回响应。您正确地认为,所述问题最好在不发回服务器的情况下得到解决。我想说的是,所述问题只是实际问题的代理,表单处理是如何从ASP.NET更改为MVC的?
public JsonResult Add(string txtA, string txtB)
{
    return Json(txtA + txtB);
}
$('#txtResult').val($('#txtA').val() + $('#txtB').val());
$.post(
  'Home/Add', //Action to execute
  { a: $('#txtA').val(), b: $('#txtB').val()  }, //input values
  function(data) { $('#txtResult').val(data) } //what to do with result
);