HTML-Schaltfläche zum Aufrufen einer MVC-Controller- und Aktionsmethode


203

Ich weiß, dass dies nicht richtig ist, aber zur Veranschaulichung möchte ich so etwas tun:

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

Mein Ziel ist es, eine HTML-Schaltfläche zu erstellen, die die Aktionsmethode meines MVC-Controllers aufruft.


4
Definieren Sie "Anruf". Dies kann einen AJAX-Anruf, einen Link zu einer anderen Seite oder das Posten eines Formulars bedeuten, um einige Möglichkeiten zu nennen.
3Dave

Die meisten der oben genannten Antworten haben möglicherweise bereits funktioniert, leider hat keine für mich funktioniert. Ich habe hier eine nützliche Antwort von einem anderen Stackoverflow-Beitrag gefunden! Es funktionierte für mich auf ASP mit Dot Net Framework 4.7 MVC5 und Bootstrap Version 3. * und natürlich in Razor View. Ich gehe davon aus, dass der Hauptzweck der Frage darin besteht, einen Link anzuzeigen, der wie eine Schaltfläche aussieht.
Imran Faruqi

Antworten:


264

Sie müssen überhaupt kein Formular verwenden, es sei denn, Sie möchten Beiträge zur Aktion veröffentlichen. Eine Eingabeschaltfläche (nicht senden) reicht aus.

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

1
Ich habe diesen Vorschlag verwendet, da kein Formular erforderlich ist. Danke dir!
Aaron Salazar

2
kann es in einen HtmlHelper so etwas wiepublic 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
es gibt nicht abgeschlossenen String konstanten Fehler in meinem Code
Burak Karakuş

5
Wenn Sie damit einen Parameter übergeben möchten, können Sie<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

Die Rasiermessersyntax ist hier:

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

4
Ich habe immer noch einen Fehler "nicht abgeschlossene Zeichenfolgenkonstante" in der IDE, der immer noch nicht richtig gerendert wurde. Ich musste die Lösung von hier verwenden: stackoverflow.com/a/16420877/410937
atconway

1
@atconway - seltsam, es hat bei mir genau so funktioniert, wie diese Antwort es darstellt. VS2013.
Ametren

6
@atconway - hatte den gleichen Fehler, aber geändert, änderte das Tag von 'input'zu 'button'und das löste den Fehler.
Tony Stark

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

in meinem Fall nur mit <button type="button" class="btn btn-primary" onclick="location.href='@Url.Action("action", "controller")'" >Go Somewhere Else</button>dem Trick
Atiq Baqi

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

type = "button" verhindert das Senden von Seiten. Stattdessen führt es Ihre Aktion aus.


16

Versuche dies:

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

Dies sollte für Sie funktionieren.


Sie können auch Bootstrap oder andere CSS-Klassen wie diese verwenden: @ Html.ActionLink ("DisplayText", "Action", ["Controller"], routeValues: null, htmlAttributes: new {@ class = "btn btn-info btn-md ", style =" Leerraum: normal "})
Asaf

15

Mit Url.Action können Sie angeben, dass die URL für eine Controller-Aktion generiert werden soll. Sie können also eine der folgenden Methoden verwenden:

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

oder:

<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

Auf diese Weise können Sie Ihr Formular an einen bestimmten Controller und eine bestimmte Aktionsmethode in Razor senden.

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

9

Aufbauend auf einigen der oben genannten Antworten können Sie Folgendes tun:

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

6

Das HTML- <button>Element kann nur auf das Formular zurückgesetzt werden, in dem es enthalten ist.

Daher müssen Sie ein Formular erstellen, das POSTs für die Aktion erstellt, und dann ein <button>oder <input type="submit" />in das Formular einfügen .


5

Wenn Sie eine Fehlermeldung als "nicht abgeschlossene Zeichenfolgenkonstante" erhalten, verwenden Sie die folgende Rasierersyntax:

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

5

Verwenden Sie dieses Beispiel besser

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


4

Also benutze ich Razor, aber das wird auch funktionieren. Ich wickle im Grunde einen Knopf in einen Link.

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


4

Trotz der onclick-Methode können Sie die Formatierung auch wie folgt verwenden:

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

Dies funktioniert besser, wenn Sie eine Aktion mit einem HttpPost-Verbattribut haben, die Webcrawler daran hindert, diese zerstörerischen Links zu besuchen (danke an Hector Correa für diese Informationen)
Tahir Khalid

3

Verwenden Sie dieses Beispiel:

<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

Wenn Sie sich auf der Startseite ("/ Home / Index") befinden und die Indexaktion des Admin-Controllers aufrufen möchten, funktioniert Folgendes für Sie.

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

1

Verwenden Sie dieses Beispiel besser .

Rufen Sie Aktion und Controller mit einem ActionLink:

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

0

OK, Sie brauchen im Grunde die Aktion auf die Schaltfläche passieren und es nennen , wenn Klick geschieht, ist es nicht von innen eine sein muss, können Sie HTML verwenden , onclickauf Taste es ausgelöst wird, wenn die Schaltfläche geklickt bekommen ...

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

0

Sie können immer mit htmlHelpers herumspielen und ein paar Sachen bauen

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

Und dann auf der Ansicht nennen Sie es so

@Html.BtnWithAction("btnCaretakerBack", "Back", "btn btn-primary float-right", "Index", "Caretakers")
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.