私は形でキャンセルボタンを持つフォーム

Question

でキャンセルボタン：

@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" /> 

     } 

問題は、私はそれをクリックしたときに、このボタンは、特定のビューに行きたいです。これはどうすればいいですか？

Answer 1

キャンセルボタンを@ Html.ActionLinkヘルパーメソッドを使用してアンカータグとして変換し、リンクをボタンのように見せるcssクラスを適用し、そのリンクのコントローラアクションでは、特定のビュー。

@Html.ActionLink("Cancel","Index","Products",null, new { @class="clsButtonFake"}) 

または

使用2は、フォームのボタンを提出します。 1つは実際の送信用で、もう1つはキャンセル用です。あなたのコントローラーアクションでは、アクションメソッドと呼ばれるボタンをチェックしてください。 そうShyjuのappraochで、あなたはMVC ActionLinkのヘルパーに建てを使用here in this answer.

Answer 2

<a href="@Url.Action("CancelBid", "Auction")"><img src="../../Content/css/img/btn-submit.png" class="btn-form" /></a> 

Answer 3

それについての詳細を読むことができます。これを行うには、CSSを使って画像やアイコンを表示する必要があります。しかし、これははるかにキャッシュ可能です。特に、cssで画像にbase64文字列を使用する場合は特にそうです。

私はAdautoのアプローチが好きです。なぜなら、マークアップの制御をより強くするからです。 MVC Htmlヘルパーは素晴らしいですが、WebFormsの考え方にはまだ頭を浮かべているようです。「心配しないで、あなたのために世話をします」。

私が追加することの1つは、Url.Contentです。

<a href="@Url.Action("CancelBid", "Auction")"><img src="@Url.Content("~/Content/css/img/btn-submit.png" class="btn-form" /></a> 

コンテンツの場所を基準にして、コンテンツの場所を知る必要はありません。あなたがボタンとしての外観を保持したい場合は

Answer 4

<a href="/Auction/[ActionName]"> 
    <input type="image" src="@Url.Content("~/Content/css/img/btn-cancel.png")" class="btn-form" /> 
</a> 

、あなたはこのような何かを行うことができ：[ActionName]ご希望のビューを返します。アクションの名前です

<a href="/Auction/[ActionName]"> 
    <input type="button" value="Cancel"> 
</a> 

。

Answer 5

またはスタイルのボタンを提出：

<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 

Answer 6

は、これは私のボタンの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> 

Answer 7

ブラウザのいずれかで動作していた回答がたくさんありました。

これは、すべてで働いていた -

<input type="button" value="Cancel" onclick="location.href='@Url.Action("Index","Home")';"/> 

Answer 8

を私はキャンセルボタンを再利用することができるように、私はヘルパーを作ってしまいました。私はフォームに記入した後にキャンセルボタンをクリックした場合にjs confirmを追加しました。

@helper FormCancelButton(string cancelUrl) 
{ 
    <button type="button" class="btn" onclick="if (confirm('Cancel changes?')) location.href = '@cancelUrl';">Cancel</button> 
} 

私はそのようにようにそれを呼び出す：

@FormCancelButton(Url.Action("Index", "User")) 

あなたが本当に注目している場合、あなたは試みることができるとdetect the dirty state of the formを過ぎると、フォームが変更された場合のみ、確認ダイアログが表示されます。