Przycisk HTML wywołujący kontroler MVC i metodę akcji


204

Wiem, że to nie w porządku, ale dla ilustracji chciałbym zrobić coś takiego:

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

Moim celem jest utworzenie przycisku HTML, który wywoła metodę działania mojego kontrolera MVC.


4
Zdefiniuj „połączenie”. Może to oznaczać wywołanie AJAX, link do innej strony lub opublikowanie formularza, aby wymienić kilka możliwości.
3Dave

Większość powyższych odpowiedzi mogła już zadziałać, niestety żadna nie działała dla mnie. Znalazłem tutaj przydatną odpowiedź z innego postu Stackoverflow! Działa dla mnie na ASP z ramą dot net Framework 4.7 mvc5 i bootstrap w wersji 3. * i oczywiście w Razor View. Głównym założeniem tego pytania, jak zakładam, jest pokazanie linku, który wygląda jak przycisk.
Imran

Odpowiedzi:


264

W ogóle nie musisz używać formularza, chyba że chcesz opublikować post na akcji. Przycisk wprowadzania (nie prześlij) załatwi sprawę.

  <input type="button"
         value="Go Somewhere Else"
         onclick="location.href='<%: Url.Action("Action", "Controller") %>'" />

1
Użyłem tej sugestii, ponieważ nie wymaga formularza. Dziękuję Ci!
Aaron Salazar,

2
może zawinąć go w HtmlHelper coś w stylupublic 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

11
powoduje ciągły błąd nieokreślonego ciągu w moim kodzie
Burak Karakuş

5
Jeśli chcesz przekazać parametr z tym parametrem, możesz użyć<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

Składnia Razor jest tutaj:

<input type="button" value="Create" onclick="location.href='@Url.Action("Create", "User")'" />

4
Nadal dostaję błąd „niezakończonej stałej ciągu” w IDE, który nadal nie wyświetlał się poprawnie. Musiałem użyć rozwiązania stąd: stackoverflow.com/a/16420877/410937
atconway

1
@atconway - dziwne, działało dla mnie dokładnie tak, jak przedstawia to odpowiedź. VS2013.
ametren

6
@atconway - wystąpił ten sam błąd, ale zmieniono zmieniono tag z 'input'na 'button'i to rozwiązało błąd.
Tony Stark

6
Z parametrami <input type = "button" title = "Delete" value = "D" onclick = "location.href = '@ Url.Action („ Delete ”,„ movies ”, new {id = item.ID})” "/>
Sandeep

w moim przypadku po prostu <button type="button" class="btn btn-primary" onclick="location.href='@Url.Action("action", "controller")'" >Go Somewhere Else</button>zrobiłem lewę
Atiq Baqi

69
<button type="button" onclick="location.href='@Url.Action("MyAction", "MyController")'" />

type = "button" zapobiega przesyłaniu strony. zamiast tego wykonuje twoją akcję.


16

Spróbuj tego:

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

To powinno ci pomóc.


możesz także użyć bootstrap lub innych klas css, takich jak: @ Html.ActionLink („DisplayText”, „Action”, [„Controller”], routeValues: null, htmlAttributes: new {@ class = "btn btn-info btn-md ", style =" white-space: normal "})
Asaf,

15

Możesz użyć Url.Action, aby określić generowanie adresu URL do akcji kontrolera, dzięki czemu możesz użyć jednej z następujących czynności:

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

lub:

<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>

11

W ten sposób możesz przesłać formularz do określonego kontrolera i metody działania w Razor.

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

10

Opierając się na kilku powyższych odpowiedziach, możesz to zrobić:

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

6

Element HTML <button>może jedynie wysłać zwrotnie do zawierającego go formularza.

Dlatego musisz utworzyć formularz POST do akcji, a następnie wstawić a <button>lub <input type="submit" />w formularzu.


5

W przypadku pojawienia się błędu jako „niezakończonej stałej ciągu”, użyj następującej składni maszynki:

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

5

lepiej skorzystać z tego przykładu

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


4

Tak więc używam Razor, ale to będzie działać przy użyciu obu. Zasadniczo zawijam przycisk w linku.

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


4

Pomimo metody onclick możesz również użyć formaction w następujący sposób:

<button type="submit" id="button1" name="button1" formaction='@Url.Action("Action", "Controller")'>Save</button>

Działa to lepiej, jeśli masz akcję z atrybutem czasownika HttpPost, uniemożliwi to robotom indeksującym odwiedzanie destrukcyjnych linków (podziękowania dla Hectora Correi za tę informację)
Tahir Khalid

3

Skorzystaj z tego przykładu:

<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>

1

Jeśli jesteś na stronie głównej („/ Home / Index”) i chcesz wywołać akcję Indeks kontrolera administracyjnego, skorzystanie z tej opcji będzie dla Ciebie odpowiednie.

<li><a href="/Admin/Index">Admin</a></li>

1

lepiej skorzystać z tego przykładu .

Wywołaj akcję i kontroler za pomocą ActionLink:

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

0

OK, to w zasadzie trzeba przekazać skargę do przycisku i nazwać gdy kliknięcie dzieje, to nie musi znajdować się wewnątrz od, można używać HTML onclickna przycisku do uruchomienia go, gdy przycisk dostać kliknięciu ...

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

0

Zawsze możesz bawić się przy pomocy htmlHelpers i budować różne rzeczy

    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);
        }
    }

A potem w widoku nazywają to tak

@Html.BtnWithAction("btnCaretakerBack", "Back", "btn btn-primary float-right", "Index", "Caretakers")
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.