我想创建一个按钮,单击该按钮会调用一个动作。我曾经Html.ActionLink
创建一个链接,它完全可以做到这一点,但没有Html.ActionButton
. 还有其他方法吗?
13 回答
这是一个使用 Bootstrap 的 CSS 按钮并将其应用于链接以使其看起来与按钮完全相同的示例。
@Html.ActionLink("Select", "Select", new { id = patient.Id }, new { @class = "btn btn-primary", @style = "color:white" })
还有其他方法吗?
您可以使用 html <form>
:
@using (Html.BeginForm("someAction", "someController"))
{
<button type="submit">OK</button>
}
这看起来很简单——我错过了什么吗?
@Html.ActionLink("About", "About","Home", new { @class = "btn btn-success" })
用这个:
@using (Html.BeginForm("yourAction", "yourController"))
{
<input type="submit" value="Some text"/>
}
@using (Html.BeginForm("ActionName", "ControllerName")){
<input type="button" value="Submit" />
}
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" })
有时您的按钮可能有嵌套标记(例如图标)
这可能对某些人有帮助:
<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>
您可以编写一个到控制器的链接并以这种方式查看/跳过整个剃刀符号(最近在我的本地主机上为我工作!):
<a href="../Home(controller)/Index(view)"><button type="submit">OK</button></a>
使用 FORMACTION
<input type="submit" value="Delete" id="delete" formaction="@Url.Action("Delete", new { id = Model.Id })" />
我知道这是一个老话题,但这对我有帮助:
@Html.ActionLink("New member", "Create", null, new {@class = "btn btn-default"})
确保您使用正确的过载,否则您将被引导到错误的控制器。
您需要在新的 {} 之前使用“null”,如下所示:
@Html.ActionLink("About", "Action Name","Controller Name",null, new { @class = "btn btn-success" })
注意上面的空值。这个很重要!!!
对于那些试图使锚标记看起来像 Bootstrap v3(可能也是 v4)中的按钮的人,请注意引导程序针对 Input 元素而不是 A 元素的边距存在一些细微的样式差异。当试图将几个按钮放在一起时,这可能会有点令人沮丧。
MVC 没有 ButtonLink 帮助器的一个相当明显的原因是:想想看。按钮不链接到任何东西。他们运行代码。那么助手会渲染什么代码呢?我的意思是它看起来很简单,它可以渲染类似 onclick="window.location=/controller/method..." 但是,这真的是你想要的吗?这是每个人一直想要的吗?那真的只是做一个 GET 吗?它变得有点愚蠢。
所以,真的,如果你想要一个打开链接的按钮,最简单的方法是按照其他人的建议设置 A 标签的样式,使其看起来像一个按钮,然后可能会进入你的样式表并为你的按钮锚点做一个非常具体的目标获得与实际按钮相同的样式。或者使用输入标记并强制 Razor(或其他)将链接内嵌到您的 JavaScript 中。