Botón HTML que llama a un controlador MVC y método de acción

205

Sé que esto no está bien, pero en aras de la ilustración, me gustaría hacer algo como esto:

<%= Html.Button("Action", "Controller") %>

Mi objetivo es crear un botón HTML que llame al método de acción de mi controlador MVC.

Aaron Salazar
fuente
44
Definir "llamada". Esto podría significar una llamada AJAX, un enlace a otra página o publicar un formulario, por nombrar algunas posibilidades.
3Dave
La mayoría de las respuestas anteriores podrían haber funcionado, desafortunadamente ninguna funcionó para mí. ¡Encontré aquí una respuesta útil de otra publicación de Stackoverflow! Funcionó para mí en ASP con dot net framework 4.7 mvc5 y bootstrap versión 3. * y, por supuesto, en Razor View. El objetivo principal de la pregunta, como supongo, es mostrar un enlace que se parece a un botón.
Imran Faruqi

Respuestas:

265

No es necesario utilizar un formulario a menos que desee publicar en la acción. Un botón de entrada (no enviar) hará el truco.

  <input type="button"
         value="Go Somewhere Else"
         onclick="location.href='<%: Url.Action("Action", "Controller") %>'" />
queso Cheddar
fuente
1
Usé esta sugerencia porque no requiere un formulario. ¡Gracias!
Aaron Salazar
2
puede envolverlo en un HtmlHelper algo comopublic static string ActionButton(this HtmlHelper helper, string action, string controller, string text) { return String.Format("<input type=\"button\" value=\"{0}\" onclick=\"location.href='{1}' />",text,Url.Action(action,controller)); }
Menahem el
11
da un error constante de cadena sin terminar en mi código
Burak Karakuş
55
Si desea pasar un parámetro con eso, puede usar<input type="button" value="Go Somewhere Else" onclick="location.href='<%: Url.Action("Action", "Controller", new { parameter1 = value1 }) %>'" />
HowlinWulf
1
<input type = "button" value = "DeleteAll" onclick = "location.href = '@ Url.Action (" DeleteAll "," Home ")'" />
Yuchao Zhou
242

La sintaxis de Razor está aquí:

<input type="button" value="Create" onclick="location.href='@Url.Action("Create", "User")'" />
Babul Mirdha
fuente
44
Todavía recibí un error de "constante de cadena no terminada" en el IDE que todavía no se procesaba correctamente. Tuve que usar la solución desde aquí: stackoverflow.com/a/16420877/410937
atconway
1
@atconway: extraño, funcionó para mí exactamente cómo lo presenta esta respuesta. VS2013.
ametren
66
@atconway: tuvo el mismo error pero cambió, cambió la etiqueta de 'input'a 'button'y eso resolvió el error.
Tony Stark
66
Con parámetros <input type = "button" title = "Delete" value = "D" onclick = "location.href = '@ Url.Action (" Delete "," movies ", new {id = item.ID})' "/>
Sandeep
en mi caso, solo <button type="button" class="btn btn-primary" onclick="location.href='@Url.Action("action", "controller")'" >Go Somewhere Else</button>usé el truco
Atiq Baqi
69
<button type="button" onclick="location.href='@Url.Action("MyAction", "MyController")'" />

type = "button" evita que la página se envíe. en su lugar realiza tu acción.

Amir Chatrbahr
fuente
16

Prueba esto:

@Html.ActionLink("DisplayText", "Action", "Controller", route, attribute)

Esto debería funcionar para ti.

Sunny Okoro Awa
fuente
también puede usar bootstrap u otras clases css como esta: @ Html.ActionLink ("DisplayText", "Action", ["Controller"], routeValues: null, htmlAttributes: new {@ class = "btn btn-info btn-md ", style =" white-space: normal "})
Asaf
15

Puede usar Url.Action para especificar generar la url para una acción de controlador, por lo que puede usar cualquiera de los siguientes:

<form method="post" action="<%: Url.Action("About", "Home") %>">
   <input type="submit" value="Click me to go to /Home/About" />
</form>

o:

<form action="#">
  <input type="submit" onclick="parent.location='<%: Url.Action("About", "Home") %>';return false;" value="Click me to go to /Home/About" />
  <input type="submit" onclick="parent.location='<%: Url.Action("Register", "Account") %>';return false;" value="Click me to go to /Account/Register" />
</form>
Jon Galloway
fuente
11

Así es como puede enviar su formulario a un controlador específico y método de acción en Razor.

 <input type="submit" value="Upload" onclick="location.href='@Url.Action("ActionName", "ControllerName")'" />
Debendra Dash
fuente
10

Sobre la base de algunas de las respuestas anteriores, puede hacer esto:

<button onclick="location.href='@Url.Action("ActionName", "ControllerName")'" />
útilBee
fuente
6

El HTML <button> elemento solo puede devolver al formulario que lo contiene.

Por lo tanto, debe hacer un formulario que PUBLICE la acción y luego poner un <button>o <input type="submit" />en el formulario.

SLaks
fuente
5

En caso de que obtenga un error como "constante de cadena no terminada", use la siguiente sintaxis de razor:

<input type="button" onclick="@("location.href='"+ Url.Action("Index","Test")+ "'")" />
Gaurav Joshi
fuente
5

A pesar del Método onclick, también puede usar la formación de la siguiente manera:

<button type="submit" id="button1" name="button1" formaction='@Url.Action("Action", "Controller")'>Save</button>
Rahul Bhat
fuente
Esto funciona mejor si tiene una acción con un atributo de verbo HttpPost que impedirá que los rastreadores web visiten esos enlaces destructivos (gracias a Héctor Correa por esta información)
Tahir Khalid
5

es mejor usar este ejemplo

<a href="@Url.Action("Register","Account", new {id=Item.id })"
class="btn btn-primary btn-lg">Register</a>

Alex Siela
fuente
4

Entonces, estoy usando Razor pero esto funcionará usando cualquiera. Básicamente estoy envolviendo un botón en un enlace.

<a href="Controller/ActionMethod">
    <input type="button" value="Click Me" />
</a>
jade290
fuente
3

Usa este ejemplo:

<button name="nameButton" id="idButton" title="your title" class="btn btn-secondary" onclick="location.href='@Url.Action( "Index","Controller" new {  id = Item.id })';return false;">valueButton</button>
Mohamed Wardan
fuente
1

Si está en la página de inicio ("/ Inicio / Índice") y desea llamar a la acción Índice del controlador de administración, lo siguiente funcionaría para usted.

<li><a href="/Admin/Index">Admin</a></li>
Pabitra Dash
fuente
1

es mejor usar este ejemplo .

Llamar a la acción y al controlador utilizando un ActionLink:

@Html.ActionLink("Submit", "Action", "Controller", route, new { @class = "btn btn-block"})
Rahul Raut
fuente
0

OK, básicamente necesita pasar la acción al botón y llamarlo cuando se hace clic, no necesita estar dentro de un, puede usar HTML onclicken el botón para activarlo cuando se hace clic en el botón ...

<button id="my-button" onclick="location.href='@Url.Action("YourActionName", "YourControllerName")'">Submit</button>
Alireza
fuente
0

Siempre puedes jugar con htmlHelpers y construir algunas cosas

    public static IHtmlContent BtnWithAction(this IHtmlHelper htmlHelper, string id, string text, string css="", string action="", string controller="")
    {
        try
        {
            string str = $"<button id=\"{id}\" class=\"{css}\" type=\"button\" ###>{text}</button>";
            if (!string.IsNullOrEmpty(action) && !string.IsNullOrEmpty(controller))
            {                    
                string url = ((TagBuilder)htmlHelper.ActionLink("dummy", action, controller)).Attributes["href"];
                var click = !string.IsNullOrEmpty(url) ? $"onclick=\"location.href='{url}'\"" : string.Empty;
                return new HtmlString(str.Replace("###", click));
            }
            return new HtmlString(str.Replace("###", string.Empty));
        }
        catch (Exception ex)
        {
            Log.Error(ex, ex.Message);
            var fkup = "<script>alert(\"assumption is the mother of all failures\")</script>";
            return new HtmlString(fkup);
        }
    }

Y luego en la vista llámalo así

@Html.BtnWithAction("btnCaretakerBack", "Back", "btn btn-primary float-right", "Index", "Caretakers")
Kabindas
fuente