botón Cancelar en forma

Question

tengo un botón Cancelar en un formulario:

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

     } 

La cuestión es que quiero en este botón para ir a una visión particular cuando hago clic en él. ¿Cómo hago esto?

Answer 1

O puede convertir el botón Cancelar como una etiqueta de ancla con el método de ayuda @ Html.ActionLink y aplicar una clase css que hace que el enlace parezca un botón y luego en la acción del controlador para ese enlace, puede devolver el vista específica.

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

o

Uso 2 botones de envío en el formulario. Uno para el envío real y el otro para la cancelación. y en la acción de su controlador, verifique qué botón llamó al método de acción. Puede leer mas sobre esto 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

Así que con appraoch de Shyju, se utiliza el construido en MVC ActionLink ayudante. Al hacer esto, necesitarás tener cualquier imagen o ícono hecho a través de CSS. Sin embargo, esto es mucho más cachable, especialmente si usa cadenas base64 para sus imágenes en css.

Me gusta el enfoque de Adauto porque le da mucho más control del marcado. Los MVC Html Helpers son agradables, pero todavía parecen tener sus mentes en la mentalidad de WebForms de "no te preocupes, nosotros nos ocuparemos de eso".

Lo que yo agregaría es Url.Content.

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

Nunca es realmente una buena idea para hacer que sus puntos de vista tienen que conocer la ubicación del contenido relativo a su ubicación.

Answer 4

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

si desea conservar su aspecto como un botón, usted podría hacer algo como esto:

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

donde [ActionName] es el nombre de la acción que le devolverá la vista deseada.

Answer 5

O un botón con el estilo de confirmación:

<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

Ésta es mi botón 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> 

continuación para personalizar el atributo onclick en

<input type="submit" value="Save Form" name="Save" class="submit-button btn-form" /> 

Entonces Javascript para botón de cancelación algunas vistas que hago esto:

<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

Muchas de las respuestas funcionaron en cualquiera de los navegadores, Chrome o sea, pero no todas.

Esto funcionó en absoluto -

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

Answer 8

Acabé por hacer un ayudante para que pudiera volver a utilizar el botón de cancelación.Agregué una confirmación js en caso de que las personas hagan clic en el botón Cancelar por accidente después de completar el formulario.

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

entonces yo lo llamo así:

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

Si usted está realmente interesado puede probar y detect the dirty state of the form también y sólo muestran el diálogo de confirmación si la forma había sido cambiado.