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.