C# 将按钮事件等转换为ASP.NET MVC
给定一个asp.net Web表单页面 asp.netC# 将按钮事件等转换为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: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
);