Tombol HTML memanggil metode Kontrol dan Aksi MVC

205

Saya tahu ini tidak benar, tetapi demi ilustrasi saya ingin melakukan sesuatu seperti ini:

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

Tujuan saya adalah membuat tombol HTML yang akan memanggil metode tindakan pengontrol MVC saya.

Aaron Salazar
sumber
4
Tentukan "panggilan." Ini bisa berarti panggilan AJAX, tautan ke halaman lain, atau posting formulir, untuk menyebutkan beberapa kemungkinan.
3Dave
Sebagian besar jawaban di atas mungkin sudah berfungsi, sayangnya tidak ada yang berhasil untuk saya. Saya menemukan di sini jawaban yang berguna dari pos Stackoverflow lain! Ini bekerja untuk saya di ASP dengan kerangka net 4,7 mvc5 dan bootstrap versi 3. * dan tentu saja di Razor View. Tujuan utama dari pertanyaan yang saya asumsikan adalah untuk menunjukkan tautan yang terlihat seperti tombol.
Imran Faruqi

Jawaban:

265

Tidak perlu menggunakan formulir sama sekali kecuali Anda ingin memposting ke tindakan. Tombol input (tidak mengirimkan) akan melakukan trik.

  <input type="button"
         value="Go Somewhere Else"
         onclick="location.href='<%: Url.Action("Action", "Controller") %>'" />
Cheddar
sumber
1
Saya menggunakan saran ini karena tidak memerlukan formulir. Terima kasih!
Aaron Salazar
2
dapat membungkusnya dalam sesuatu HtmlHelper sepertipublic 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
itu memberikan string konstan error yang tidak tertentu dalam kode saya
Burak Karakuş
5
Jika Anda ingin melewatkan parameter dengan itu, Anda dapat menggunakan<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

Sintaks silet ada di sini:

<input type="button" value="Create" onclick="location.href='@Url.Action("Create", "User")'" />
Babul Mirdha
sumber
4
Saya masih mendapatkan kesalahan "string konstan tidak tertentu" di IDE yang masih belum render dengan benar. Saya harus menggunakan solusi dari sini: stackoverflow.com/a/16420877/410937
atconway
1
@ atconway - aneh, itu bekerja untuk saya persis bagaimana jawaban ini disajikan. VS2013.
ametren
6
@atconway - memiliki kesalahan yang sama tetapi perubahan mengubah tag dari 'input'menjadi 'button'dan yang menyelesaikan kesalahan.
Tony Stark
6
Dengan Parameter <input type = "button" title = "Hapus" value = "D" onclick = "location.href = '@ Url.Action (" Hapus "," film ", new {id = item.ID})' "/>
Sandeep
dalam kasus saya hanya menggunakan <button type="button" class="btn btn-primary" onclick="location.href='@Url.Action("action", "controller")'" >Go Somewhere Else</button>melakukan trik
Atiq Baqi
69
<button type="button" onclick="location.href='@Url.Action("MyAction", "MyController")'" />

type = "button" mencegah halaman mengirim. alih-alih itu melakukan tindakan Anda.

Amir Chatrbahr
sumber
16

Coba ini:

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

Ini seharusnya bekerja untuk Anda.

Sunny Okoro Awa
sumber
Anda juga dapat menggunakan bootstrap atau kelas css lainnya seperti ini: @ Html.ActionLink ("DisplayText", "Action", ["Controller"], routeValues: null, htmlAttributes: new {@ class = "btn btn-info btn-md ", style =" white-space: normal "})
Asaf
15

Anda dapat menggunakan Url.Action untuk menentukan menghasilkan url ke tindakan pengontrol, sehingga Anda bisa menggunakan salah satu dari berikut ini:

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

atau:

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

Ini adalah bagaimana Anda bisa mengirimkan formulir Anda ke pengontrol dan metode tindakan tertentu di Razor.

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

Membangun beberapa jawaban di atas, Anda bisa melakukan ini:

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

<button>Elemen HTML hanya dapat mengirim kembali ke formulir yang berisi itu.

Oleh karena itu, Anda perlu membuat formulir yang POST untuk tindakan, lalu masukkan a <button>atau <input type="submit" />dalam formulir.

Slaks
sumber
5

Dalam kasus jika Anda mendapatkan kesalahan sebagai "konstanta string tak tertentu", gunakan sintaks silet berikut:

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

Meskipun Metode onclick Anda juga dapat menggunakan formaction sebagai berikut:

<button type="submit" id="button1" name="button1" formaction='@Url.Action("Action", "Controller")'>Save</button>
Rahul Bhat
sumber
Ini berfungsi lebih baik jika Anda memiliki tindakan dengan atribut kata kerja HttpPost itu akan menghentikan perayap web dari mengunjungi tautan yang merusak (terima kasih kepada Hector Correa untuk info ini)
Tahir Khalid
5

lebih baik gunakan contoh ini

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

Alex Siela
sumber
4

Jadi, saya menggunakan Razor tapi ini juga bisa digunakan. Saya pada dasarnya membungkus tombol di tautan.

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

Gunakan contoh ini:

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

Jika Anda berada di beranda ("/ Beranda / Indeks") dan Anda ingin memanggil tindakan Indeks pengontrol Admin, berikut ini akan bekerja untuk Anda.

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

lebih baik gunakan contoh ini .

Panggilan aksi dan pengontrol menggunakan ActionLink:

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

OK, pada dasarnya Anda perlu meneruskan aksi ke tombol dan menyebutnya ketika klik terjadi, itu tidak perlu di dalam dari, Anda dapat menggunakan HTML onclickpada tombol untuk memicu ketika tombol diklik ...

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

Anda selalu dapat bermain-main dengan htmlHelpers dan membuat beberapa hal

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

Dan kemudian pada tampilan panggil seperti ini

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