Кнопка "Отмена" в форме
У меня есть кнопка "Отмена" в форме:
@using (Html.BeginForm("ConfirmBid","Auction"))
{
some stuff ...
<input type="image" src="../../Content/css/img/btn-submit.png" class="btn-form" />
<input type="image" src="../../Content/css/img/btn-cancel.png" class="btn-form" />
}
проблема в том, что я хочу, чтобы эта кнопка переходила к определенному представлению, когда я нажимаю на нее. Как мне это сделать?
9 ответов
либо вы можете преобразовать кнопку отмены в качестве якорного тега с @Html.Метод помощника ActionLink и применить класс css, который делает ссылку на Выглядит как кнопка, а затем в действии контроллера для этой ссылки, вы можете вернуть определенное представление.
@Html.ActionLink("Cancel","Index","Products",null, new { @class="clsButtonFake"})
или
используйте 2 кнопки отправки в форме. Один для real submit и один для отмены. и в вашем действии контроллера проверьте, какая кнопка вызвала метод действия. Вы можете прочитать больше об этом здесь этот ответ.
Это моя кнопка HTML:
<button type="button"
class="btn btn-inverse"
id="cancel"
onclick="window.history.back()">
<i class="icon-remove icon-large"></i>
<br />@Localization.Cancel
</button>
затем Настройки onclick
атрибут в некоторых представлениях я делаю это:
<script>
$(document).ready(function ()
{
$("#cancel").
attr("onClick",
"document.location.href='@Html.Raw(Url.Action("Index", "Standard",
new { ManualId = Model.ManualId, ChapterId = Model.ChapterId }))'");
});
</script>
или стилизовать кнопки:
<input type="submit" value="Save Form" name="Save" class="submit-button btn-form" />
затем Javascript для кнопки отмены:
<input type="button" onclick="document.location.href('Home/Index')" value="Cancel" class="cancel-button btn-form" />
// Note: This avoids any of the validation that may happen in the model that
// normally gets triggered with a submit
многие ответы работали в любом из браузеров, chrome или ie, но не все.
он работал в
<input type="button" value="Cancel" onclick="location.href='@Url.Action("Index","Home")';"/>
поэтому с помощью appraoch Shyju вы используете встроенный помощник MVC ActionLink. Делая это, вам нужно будет иметь любые изображения или значки, сделанные через css. Однако это гораздо более доступно, особенно если вы используете строки base64 для своих изображений в css.
Мне нравится подход Adauto, потому что это дает вам гораздо больше контроля над разметкой. Помощники MVC Html хороши, но они все еще, похоже, имеют свои головы в мышлении WebForms "не беспокойтесь об этом, мы позаботимся об этом вы."
единственное, что я бы добавил, Это Url.Содержание.
<a href="@Url.Action("CancelBid", "Auction")"><img src="@Url.Content("~/Content/css/img/btn-submit.png" class="btn-form" /></a>
это никогда не очень хорошая идея, чтобы ваши представления должны знать местоположение контента относительно его местоположения.
<a href="/Auction/[ActionName]">
<input type="image" src="@Url.Content("~/Content/css/img/btn-cancel.png")" class="btn-form" />
</a>
Если вы хотите сохранить его внешний вид как кнопки, вы могли бы сделать что-то вроде этого:
<a href="/Auction/[ActionName]">
<input type="button" value="Cancel">
</a>
здесь [ActionName]
- это название действия, которое вернет желаемое представление.
<a href="@Url.Action("CancelBid", "Auction")"><img src="../../Content/css/img/btn-submit.png" class="btn-form" /></a>
Я закончил тем, что сделал помощника, чтобы я мог повторно использовать кнопку отмены. Я добавил подтверждение js в случае, если люди случайно нажимают кнопку отмены после заполнения формы.
@helper FormCancelButton(string cancelUrl)
{
<button type="button" class="btn" onclick="if (confirm('Cancel changes?')) location.href = '@cancelUrl';">Cancel</button>
}
Я тогда называю это так:
@FormCancelButton(Url.Action("Index", "User" ))
Если вы действительно заинтересованы, вы можете попробовать и обнаружение грязного состояния формы тоже и только показать диалог подтверждения, если форма была изменена.
<asp:Button runat="server" class="btn btn-danger"
CausesValidation="false" onclick="Cancel_Click" Text="Cancel"/>
protected void Cancel_Click(object sender, EventArgs e)
{
Response.Redirect("Test.aspx");
}