Html.ActionLink作为按钮或图像,而不是链接

Question

在ASP.NET MVC的最新版本(RC1)中,如何将Html.ActionLink呈现为按钮或图像而不是链接？

Answer 1

我喜欢使用Url.Action()和Url.Content(),如下所示:

<a href='@Url.Action("MyAction", "MyController")'>
    <img src='@Url.Content("~/Content/Images/MyLinkImage.png")' />
</a>

严格来说,只有路径所需的Url.Content才不是你问题答案的一部分.

感谢@BrianLegg指出这应该使用新的Razor视图语法.示例已相应更新.

Answer 2

延迟响应但您可以保持简单并将CSS类应用于htmlAttributes对象.

<%= Html.ActionLink("Button Name", "Index", null, new { @class="classname" }) %>

然后在样式表中创建一个类

a.classname
{
    background: url(../Images/image.gif) no-repeat top left;
     display: block;
     width: 150px;
     height: 150px;
     text-indent: -9999px; /* hides the link text */
}

Answer 3

借用Patrick的回答,我发现我必须这样做:

<button onclick="location.href='@Url.Action("Index", "Users")';return false;">Cancel</button>

避免调用表单的post方法.

Answer 4

叫我简单化,但我只是这样做:

<a href="<%: Url.Action("ActionName", "ControllerName") %>">
    <button>Button Text</button>
</a>

你只需要处理超链接突出显示.我们的用户喜欢它:)

Answer 5

简单地说:

<button onclick="@Url.Action("index", "Family", new {familyid = Model.FamilyID })">Cancel</button>

Answer 6

一个迟到的答案,但这就是我将ActionLink变成按钮的方式.我们在项目中使用Bootstrap,因为它很方便.没关系@T,因为它只是我们正在使用的翻译器.

@Html.Actionlink("Some_button_text", "ActionMethod", "Controller", "Optional parameter", "html_code_you_want_to_apply_to_the_actionlink");

上面给出了这样的链接,如下图所示:

localhost:XXXXX/Firms/AddAffiliation/F0500

在我看来:

@using (Html.BeginForm())
{
<div class="section-header">
    <div class="title">
        @T("Admin.Users.Users")
    </div>
    <div class="addAffiliation">
        <p />
        @Html.ActionLink("" + @T("Admin.Users.AddAffiliation"), "AddAffiliation", "Firms", new { id = (string)@WorkContext.CurrentFirm.ExternalId }, new { @class="btn btn-primary" })
    </div>
</div>

}

希望这有助于某人

Answer 7

如果您不想使用链接,请使用按钮.你也可以添加图像到按钮:

<button type="button" onclick="location.href='@Url.Action("Create", "Company")'" >
   Create New
   <img alt="New" title="New" src="~/Images/Button/plus.png">
</button>

type ="button"执行您的操作,而不是提交表单.

Answer 8

使用bootstrap这是创建链接到控制器操作的最短且最干净的方法,该控制器操作显示为动态按钮:

<a href='@Url.Action("Action", "Controller")' class="btn btn-primary">Click Me</a>

或者使用Html助手:

@Html.ActionLink("Click Me", "Action", "Controller", new { @class = "btn btn-primary" })

Answer 9

你不能这样做Html.ActionLink.您应该使用Url.RouteUrl并使用URL来构造所需的元素.

Answer 10

<button onclick="location.href='@Url.Action("NewCustomer", "Customers")'">Checkout >></button>

Answer 11

甚至以后的回复,但我刚遇到类似的问题,最后写了我自己的Image链接HtmlHelper扩展.

您可以在我上面的链接中找到它的实现.

刚刚添加,以防有人正在寻找一个实现.

Answer 12

一个简单的方法可以将你的Html.ActionLink变成一个按钮(只要你插入了BootStrap - 你可能拥有它)就像这样:

@Html.ActionLink("Button text", "ActionName", "ControllerName", new { @class = "btn btn-primary" })

Answer 13

<li><a href="@Url.Action(  "View", "Controller" )"><i class='fa fa-user'></i><span>Users View</span></a></li>

显示带有链接的图标