37

How can one call a javascript function in html.actionlink in asp.net mvc?

I want to call one method, which is in JavaScript, but how I call it within html.actionlink in the same page?

starball
  • 20,030
  • 7
  • 43
  • 238
Renu123
  • 1,325
  • 6
  • 18
  • 25
  • To me, it is not clear what you're trying to achieve. Html.ActionLink runs on the server, your javascript runs on the client; there is no way the one can call the other. Do you mean you want some piece of javascript to be executed when the link that is created by Html.ActionLink is clicked? – Thomas May 18 '10 at 09:46
  • yes i want to call one method when clicked on particular link – Renu123 May 18 '10 at 11:13
  • It's worth noting that if your link is ONLY triggering some javascript, i.e a popup, and you dont actually want the user to navigate somewhere, then ActionLink is not the element you need. Standard href would be best for that scenario. – user2903379 May 16 '18 at 13:17

6 Answers6

67

you need to use the htmlAttributes anonymous object, like this:

<%= Html.ActionLink("linky", "action", "controller", new { onclick = "someFunction();"}) %>

you could also give it an id an attach to it with jquery/whatever, like this:

<%= Html.ActionLink("linky", "action", "controller", new { id = "myLink" }) %>


$('#myLink').click(function() { /* bla */ });
Andrew Bullock
  • 36,616
  • 34
  • 155
  • 231
26

For calling javascript in your action link you simply need to write actionlink like this:

@Html.ActionLink("Delete", "Your-Action", new { id = item.id },
                 new { onclick="return confirm('Are you sure?');"})

Don't get confused between route values and the html attributes.

pb2q
  • 58,613
  • 19
  • 146
  • 147
Ashwini
  • 707
  • 8
  • 5
9
<a onclick="MyFunc()">blabla..</a>

There is nothing more in @Html.ActionLink that you could utilize in this case. And razor is evel by itself, drop it from where you can.

Roman Pokrovskij
  • 9,449
  • 21
  • 87
  • 142
  • to me, this is the best answer! – Ashi Apr 09 '16 at 04:36
  • 1
    Agreed. Based on just wanting to run a Javascript function, this is the more correct answer. Use an ActionLink when wanting to call the Controller, use the above to plainly call a JavaScript Function. – AxleWack Jul 13 '16 at 10:42
5
@Html.ActionLink("Edit","ActionName",new{id=item.id},new{onclick="functionname();"})
alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
Ashwini
  • 707
  • 8
  • 5
4

This is a bit of an old post, but there is actually a way to do an onclick operator that calls a function instead of going anywhere in ASP.NET

helper.ActionLink("Choose", null, null, null, 
    new {@onclick = "Locations.Choose(" + location.Id + ")", @href="#"})

If you specify empty quotes or the like in the controller/action, it'll likely add a link to what you listed. You can do that, and do a return false in the onclick. You can read more about that at:

What's the effect of adding 'return false' to a click event listener?

If you're doing this onclick in an cshtml file, it'd be a bit cleaner to just specify the link yourself (a href...) instead of having the ActionLink handle it. If you're doing an HtmlHelper, like my example above is coming from, then I'd argue that calling ActionLink is an okay solution, or potentially better, is to use tagbuilder instead.

1

This is the only one that worked for me in .cshtml file:

@Html.ActionLink(
   "Name", 
   "Action", 
   "Controller", 
   routeValues: null, 
   htmlAttributes:new Dictionary<string, object> {{ "onclick", "alert('Test');" }})

I hope this helps.

Katsifaris
  • 364
  • 1
  • 4
  • 12