MVC3 Actionlink with confirmation dialog
Asked Answered
N

4

13

Can I show a confirmation message for an ActionLink?

Do I need to use javascript? Is it possible without it?

Could you give some example for me?

Thank you.

//I want to make a confirmation message appear before the link opens.
@Html.ActionLink("Checkout and view order list", "Order", "Order")
Nedi answered 17/4, 2012 at 19:57 Comment(0)
J
40

Using the overload Html.ActionLink(string linkText, string actionName, string controllerName, object RouteValues, object HtmlAttributes) and some javascript, you can do the following:

@Html.ActionLink("Checkout and view order list", "Order", "Order", null, new { onclick="return confirm('Are you sure you want to click this link?')" })

This will add the HTML attribute onclick, which will execute the specified javascript when the link is clicked. If an onclick event on a link (or a form's submit button) returns false, the action (following the link, posting the form) doesn't happen. The confirm(message) function shows the user a confirmation dialog with the specified message, and returns either true or false depending on the user's response.

Juicy answered 17/4, 2012 at 20:3 Comment(0)
Z
1

Edit: don't use this answer, use the other one from Jim.

You won't be able to use ActionLink - you'll have to write some JavaScript (such as that listed here) to pop up a confirmation. You can use Url.Action to generate the URL that the javascript will eventually use for the post or get endpoint.

My javascript is bad, but I think this gets the idea across:

<a href="javascript:confirmation();">Checkout and view order list</a>

<script>
function confirmation() {
 var answer = confirm("Confirm?")
 if(answer) {
  // Do something here, post or get
  window.location = @Url.Action("Order", "Order");
 }
}
</script>
Zuleika answered 17/4, 2012 at 19:59 Comment(2)
ActionLink can still be used. It just can't do the confirmation on its own.Juicy
Yeah, ActionLink has a ton of overloads (sometimes it can get messy trying to use the right one). Since RouteValues and HtmlAttributes are pretty flexible as well, you can do quite a bit with ActionLinkJuicy
R
0

In my case I had a button that already called an action:

<input id="ButtonDelete" type="button" value="Delete Experiment" class="big-nevigation-button" onclick="location.href='@Url.Action("DeleteExperiment", "Experiment", new { experimentId = Model.ExperimentId })'" />

After reading Jim's answer, I changed it to the following:

<input id="ButtonDelete" type="button" value="Delete Experiment" class="big-nevigation-button" onclick="if (confirm('Are you sure you want to delete experiment???')) location.href='@Url.Action("DeleteExperiment", "Experiment", new { experimentId = Model.ExperimentId })'" />

And it works greate! Thanks Jim!!

Rutherfordium answered 29/10, 2014 at 9:13 Comment(0)
C
-1

in MVC Core, I used this, but still in JavaScript

 <button type="submit"  
  asp-action="Delete" asp-route-id="@Model.Id"
  onclick="return confirm('Are you sure you want to delete?');">
  </button>
Catholicize answered 15/2, 2021 at 10:34 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.