ActionButton而不是ActionLink

时间:2012-06-18 10:00:43

标签: asp.net-mvc-3 razor

我想创建一个按钮,单击该按钮会调用一个动作。我使用Html.ActionLink创建了一个完全相同的链接,但没有Html.ActionButton。还有其他方法吗?

13 个答案:

答案 0 :(得分:23)

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

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

答案 1 :(得分:19)

  

还有其他方法吗?

您可以使用html <form>

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

答案 2 :(得分:16)

这看起来很简单 - 我错过了什么吗?

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

答案 3 :(得分:6)

使用此:

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

答案 4 :(得分:5)

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" })

答案 5 :(得分:4)

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

答案 6 :(得分:3)

有时您的按钮可能有嵌套标记(例如图标)

这可能对某些人有所帮助:

<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>

答案 7 :(得分:2)

这应该回答你的问题。

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

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

或者使用表单内的按钮,并使用表单控件移动页面。

答案 8 :(得分:2)

您可以写一个指向控制器的链接并以这种方式查看/跳过整个剃刀符号(最近在我的localhost上为我工作过!):

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

答案 9 :(得分:2)

使用FORMACTION

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

答案 10 :(得分:2)

我知道这是一个古老的话题,但这对我有所帮助:

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

答案 11 :(得分:1)

确保使用正确的重载,否则将被定向到错误的控制器。

您需要在新的{}之前使用“空”,如下所示:

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

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

答案 12 :(得分:0)

对于那些想要使锚标记看起来像Bootstrap v3(也许也是v4)中的按钮的用户,请注意,引导区针对输入元素而不是A元素的边距存在一些细微的样式差异。尝试将多个按钮彼此并排放置时,这可能会有些令人沮丧。

MVC没有ButtonLink帮助器的原因很明显:请考虑一下。按钮不链接到任何东西。他们运行代码。那么助手将呈现什么代码?我的意思是说,它可以呈现onclick =“ window.location = / controller / method ...”之类的东西看起来很简单,但这真的是您想要的吗?是每个人都想要的吗?这不是真的吗?它有点愚蠢。

因此,实际上,如果您想要一个用于打开链接的按钮,最简单的方法是按照其他所有人的建议进行操作,并设置一个看起来像按钮的A标签,然后可能会进入样式表并针对特定的目标您的按钮锚点将获得与实际按钮相同的样式。或使用Input标记并强制Razor(或其他任何方式)使链接与JavaScript内联。