ActionButton 而不是 ActionLink答案

【问题标题】：ActionButton instead of ActionLinkActionButton 而不是 ActionLink
【发布时间】：2012-06-18 10:00:42
【问题描述】：

我想创建一个按钮，单击该按钮会调用一个动作。我已经使用Html.ActionLink 创建了一个链接，它完全可以做到这一点，但没有Html.ActionButton。还有其他方法吗？

【问题讨论】：

【解决方案1】：

这是一个使用 Bootstrap 的 CSS 按钮并将其应用于链接以使其看起来与按钮完全相同的示例。

@Html.ActionLink("Select", "Select", new { id = patient.Id }, new { @class = "btn btn-primary", @style = "color:white" })

【讨论】：

（只是吹毛求疵）还将role="button" 添加到属性中以100% 符合引导请求

【解决方案2】：

还有其他方法吗？

您可以使用 html <form>:

@using (Html.BeginForm("someAction", "someController"))
{
    <button type="submit">OK</button>
}

【讨论】：

【解决方案3】：

这看起来很简单——我错过了什么吗？

@Html.ActionLink("About", "About","Home", new { @class = "btn btn-success" })

【讨论】：

明确指出，这依赖于 btn / btn-success css 类（假设这是 Bootstrap 或类似的）。 ActionLink 创建，但问题是寻找实际的

【解决方案4】：

使用这个：

@using (Html.BeginForm("yourAction", "yourController"))
{
    <input type="submit" value="Some text"/>
}

【讨论】：

【解决方案5】：

@using (Html.BeginForm("ActionName", "ControllerName")){
   <input type="button" value="Submit" />
}

【讨论】：

【解决方案6】：

a[type="button"] {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
    margin-right: 8px;
    width: auto;
    text-decoration: none;
}

@Html.ActionLink("ActionName", "ControllerName",null, new {type = "button" })

【讨论】：

【解决方案7】：

有时您的按钮可能有嵌套标记（例如图标）

这可能对某些人有帮助：

<button type="button" onclick="location.href='@Url.Action("Action", "Controller")'" class="btn btn-success">My button name <i class="glyphicon glyphicon-search"></i></button>

type=button 是防止页面提交所必需的... 另一种可能的解决方案（如果您认为 type=button 看起来很奇怪，因为该元素已经是一个按钮）是在 OnClick javascript 处理程序中调用 event.preventDefault() .

<button onclick="event.preventDefault(); location.href='@Url.Action("Action", "Controller")'" class="btn btn-success">My button name <i class="glyphicon glyphicon-search"></i></button>

【讨论】：

我决定使用它而不是 ActionLink（标签），因为我找不到垂直居中文本的方法。 +1 @Html.ActionButton 或 ButtonLink 或其他。

【解决方案8】：

这应该可以回答您的问题。

Can I use an asp:Button like an Html.ActionLink?

使用 CSS 使链接看起来像一个按钮。

或者使用表单内的按钮和表单控件一起移动页面。

【讨论】：

【解决方案9】：

您可以编写一个到控制器的链接并以这种方式查看/跳过整个剃刀符号（最近在我的本地主机上为我工作！）：

<a href="../Home(controller)/Index(view)"><button type="submit">OK</button></a>

【讨论】：

如果您更改了路线配置，这将中断。 @Html.ActionLink 方法是动态的，可以在不依赖特定路由配置的情况下工作

【解决方案10】：

使用格式

<input type="submit" value="Delete" id="delete" formaction="@Url.Action("Delete", new { id = Model.Id })" />

【讨论】：

【解决方案11】：

我知道这是一个老话题，但这对我有帮助：

@Html.ActionLink("New member", "Create", null, new {@class = "btn btn-default"})

【讨论】：

【解决方案12】：

确保您使用正确的重载，否则您将被引导到错误的控制器。

您需要在新的 {} 之前使用“null”，如下所示：

@Html.ActionLink("About", "Action Name","Controller Name",null, new { @class = "btn btn-success" })

注意上面的空值。这很重要！！！

【讨论】：

【解决方案13】：

对于那些试图使锚标记看起来像 Bootstrap v3（可能也是 v4）中的按钮的人，请注意引导程序针对 Input 元素而不是 A 元素的边距存在一些细微的样式差异。当试图将几个按钮放在一起时，这可能会有点令人沮丧。

MVC 没有 ButtonLink 帮助器有一个相当明显的原因：想想看。按钮不链接到任何东西。他们运行代码。那么助手会渲染什么代码呢？我的意思是它看起来很简单，它可以渲染类似 onclick="window.location=/controller/method..." 但是，这真的是你想要的吗？这是每个人一直想要的吗？那真的只是做一个 GET 吗？它变得有点愚蠢。

所以，真的，如果你想要一个打开链接的按钮，最简单的方法是按照其他人的建议设置 A 标签的样式，使其看起来像一个按钮，然后可能会进入你的样式表并做一个非常具体的目标您的按钮锚点以获得与实际按钮相同的样式。或者使用 Input 标记并强制 Razor（或其他）将链接内嵌到您的 JavaScript 中。

【讨论】：