MVC3 Actionlink with confirmation dialog

Question

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

Answer 1

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.

Answer 2

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>

Answer 3

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